.animate( properties [, duration ] [, easing ] [, complete ] )
properties:CSS屬性和值,該動畫將對應移動的對象。
例:
$( "#clickme" ).click(function() {
$( "#book" ).animate({
left: "+=50",//需要變化的css屬性
}, 5000, function() {
// Animation complete.
});
});
duration:字符或是數字來定義動畫的速度,如"slow、fast、200"等
$( "#clickme" ).click(function() {
$( "#book" ).animate({
left: "+=50",//需要變化的css屬性
}, duration:5000, function() {
// Animation complete.
});
});
$( "#clickme" ).click(function() {
$( "#book" ).animate({
left: "+=50",//需要變化的css屬性
}, "slow", function() {
// Animation complete.
});
});
easing:動畫過渡的效果
$( "#clickme" ).animate(
{width:'50%'},
{
duration: 200,
easing : "easeOutQuart"//詳細內容詳見jquery ui官方文檔api
}
);