Animate

kaedah jquery animate(). sintaks

Fungsi: Kaedah animate() melaksanakan animasi tersuai set sifat CSS. Kaedah ini menukar elemen dari satu keadaan ke keadaan lain melalui gaya CSS. Nilai sifat CSS berubah secara beransur-ansur, membolehkan anda mencipta kesan animasi. Hanya nilai angka boleh dianimasikan (cth. "margin:30px"). Nilai rentetan tidak boleh dianimasikan (seperti "warna latar:merah"). Gunakan "+=" atau "-=" untuk membuat animasi relatif. .

Diperlukan . Menentukan gaya dan nilai CSS yang menghasilkan kesan animasi.

kelajuan

Pilihan. Menentukan kelajuan animasi. Lalai ialah "biasa". Nilai yang mungkin: milisaat (cth. 1500) "perlahan" "biasa" "cepat"

meringankan Pilihan. Menentukan fungsi pelonggaran yang menetapkan kelajuan animasi pada titik animasi yang berbeza. Fungsi pelonggaran terbina dalam: Lebih banyak fungsi pelonggaran disediakan dalam sambungan linear ayunan. Pilihan. Fungsi yang akan dilaksanakan selepas fungsi animasi dilaksanakan.

    <center id="o9z9c"></center>
    panggilan balik 

    Syntax 2:     $(selector).animate(styles,options)
    Parameter: 
    Stail Diperlukan. Menentukan gaya dan nilai CSS yang menghasilkan kesan animasi (sama seperti di atas). pilihanPilihan. Menentukan pilihan tambahan untuk animasi. Nilai yang mungkin: kelajuan - menetapkan kelajuan pelonggaran animasi - menentukan fungsi pelonggaran untuk digunakan panggil balik - menentukan fungsi yang akan dilaksanakan selepas animasi selesai langkah - menentukan fungsi yang akan dilaksanakan selepas setiap langkah animasi selesai beratur - Nilai Boolean. Menunjukkan sama ada hendak meletakkan animasi dalam baris gilir kesan. Jika palsu, animasi akan bermula serta-merta specialEasing - peta satu atau lebih sifat CSS daripada parameter gaya dan fungsi pelonggaran yang sepadan 
    Stail Stail 
     
    ??						
    kaedah jquery animate(). contoh
    
						
    <html>
<head>
<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
  {
  $(".btn1").click(function(){
    $("#box").animate({height:"300px"});
  });
  $(".btn2").click(function(){
    $("#box").animate({height:"100px"});
  });
});
</script>
</head>
<body>
<div id="box" style="background:#98bf21;height:100px;width:100px;margin:6px;">
</div>
<button class="btn1">Animate</button>
<button class="btn2">Reset</button>
</body>
</html>
    Jalankan Instance ?
    Klik butang "Run Instance" untuk melihat contoh dalam talian