animate 這個函式可以讓你自行定義動態效果，其參數分別為：
| 參數 | 型別 | 說明 |
| params | Options | 一組包含最終CSS樣式的{屬性:值} |
| duration | String,Number | 三種預定的速度("slow", "normal", "fast")，或 動畫間隔的毫秒數值(如一秒、1000) |
| easing | String | 緩和方式，預設是 linear 線性，還有 swing 可選 |
| callback | Function | 每個元素在完成動畫後要執行的函數 |
$("#go").click(function(){
$("#block").animate({
width: "70%",
opacity: 0.4,
marginLeft: "0.6in",
fontSize: "3em",
borderWidth: "10px"
}, 1500 );
});
練習：
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="zh-tw">
<head>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<title>fly</title>
</head>
<body>
<div id="fly">click</div>
</body>
</html>
<script type="text/javascript">
$(document).ready(function(){
$("#fly").click(function(event){
alert('click');
$("#fly").animate(
{marginLeft:"300"},
400,
function(){alert('fly ok')}
);
})
});
</script>
沒有留言:
張貼留言