Rumah >hujung hadapan web >tutorial css >Bagaimanakah Saya Boleh Menghidupkan Ketinggian Elemen kepada Saiz Semulajadi Menggunakan jQuery?

Bagaimanakah Saya Boleh Menghidupkan Ketinggian Elemen kepada Saiz Semulajadi Menggunakan jQuery?

Susan Sarandon
Susan Sarandonasal
2024-12-08 07:23:10741semak imbas

How Can I Animate an Element's Height to Its Natural Size Using jQuery?

Elemen Ketinggian Auto Beranimasi dengan jQuery

Mengembangkan elemen ke ketinggian semula jadinya boleh menjadi satu kejayaan yang sukar untuk dicapai dengan animasi. Seperti yang digambarkan dalam contoh yang disediakan, hanya menetapkan ketinggian kepada "auto" mungkin tidak mencetuskan animasi.

Untuk mengatasinya, pendekatan berbilang langkah diperlukan:

  1. Pelihara Arus Ketinggian:

    var curHeight = $('#first').height();
  2. Tetapkan Ketinggian Buat Sementara Kepada Auto:

    $('#first').css('height', 'auto');
  3. Kira Auto Ketinggian:

    var autoHeight = $('#first').height();
  4. Pulihkan Ketinggian dan Animasikan Sebelumnya:

    $('#first').height(curHeight).animate({height: autoHeight}, 1000);
  5. Sambungkan Langkah-langkah:

    var el = $('#first'),
        curHeight = el.height(),
        autoHeight = el.css('height', 'auto').height();
    el.height(curHeight).animate({height: autoHeight}, 1000);

Dengan mengikut langkah-langkah ini, elemen boleh dianimasikan dengan lancar ke ketinggian semula jadinya.

Atas ialah kandungan terperinci Bagaimanakah Saya Boleh Menghidupkan Ketinggian Elemen kepada Saiz Semulajadi Menggunakan jQuery?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn