中午好！
jQuery animate()方法允許自定義動畫.有4個參數
參數:prop 定義形成動畫的CSS樣式,幾乎可以用所有的CSS樣式,
speed 動畫的速度
easing 不同的動畫點中設置動畫速度的
callback animate()函數執行完之後，要執行的函數
例子:
<script src="/jquery/jquery-2.1.0.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("button").click(function () {
var div=$("div");
div.animate({ height: '300px' });//例子只用第1個參數
div.animate({ width: '300px'});
div.animate({ height: '100px' });
div.animate({ width: '100px' });
div.animate({ left: '250px' });
div.animate({ fontSize: '3em' });
div.animate({ height: 'hide' });
});
});
</script>
</head>
<body>
<button>開始</button>
<div style="background:#4cff00;position:absolute;height:100px;width:100px">字</div>
</body>例子:
<script src="/jquery/jquery-2.1.0.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#start").click(function(){
$("div").animate({width: '300px'},3000);
});
$("#stop").click(function () {
$("div").stop();
});
});
</script>
</head>
<body>
<button id="start">開始</button>
<button id="stop">停止</button>
<div style="background:#4cff00;position:absolute;height:100px;width:100px"></div>
</body>這個參數很多方法也有如hide(speed,callback)第1個參數時間，第2個參數就是這個函數了
例子:
<script type="text/javascript" src="/jquery/jquery-2.1.0.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("button").click(function () {
$("p").hide(3000, function () {
alert("這是hide()運行完後運行");
});
});
});
</script>
</head>
<body>
<button type="button">消失</button>
<p>點擊會消失</p>
</body>例子:
<script src="/jquery/jquery-2.1.0.js"></script>
<script>
$(document).ready(function()
{
$("button").click(function(){
$("#p1").css("color","red")
.slideUp(2000)
.slideDown(2000);
});
});
</script>
</head>
<body>
<p id="p1">加油！自己還要更努力 ！</p>
<button>點擊這裏</button>
</body>
</html>
