Turkcell | Geleceği Yazanlar

302: JQueryBaşlangıç seviyesi derslerde Web Programlama uygulama geliştirme ortamını detaylı olarak inceliyoruz.

Tüm Eğitimleri Aldın mı? Kendini sınamanın tam zamanı

Haydi Sınava Gir

jQuery slideDown() Metodu

Kategori : Mobil | Lisans : Creative Commons (by-nc-sa) | En son 12.09.2019 tarihinde güncellendi
Eğitmen : Geleceği Yazanlar Ekibi
Etiketler : web-programlama

Bir elemanı aşağıya doğru kaydırmak için kullanılır.

Yazılış biçimi:

$(seçici).slideDown(hız,geriçağırma);

Kullanımı isteğe bağlı olan hız parametresi, gizleme/görüntüleme hızını belirler ve birimi "slow" (yavaş), "fast"(hızlı) ya da milisaniye türündedir. Kullanımı yine isteğe bağlı olan "geriçağır" parametresiyse, kaydırma olayı tamamlandığı zaman çalıştırılacak bir fonksiyondur.

slideDown() örnek HTML5 kodunu aşağıda inceleyebilirsiniz:

<!DOCTYPE html>
<html>
    <head>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
        <script>
            $(document).ready(function(){
                              $("#flip").click(function(){
                                               $("#panel").slideDown("slow");
                                               });
                              });
            </script>
        
        <style>
            #panel,#flip
            {
                padding:7px;
                text-align:center;
                background-color:#e5eefc;
                border:solid 2px #c3c4c3;
            }
        #panel
        {
            padding:50px;
            display:none;
        }
        </style>
    </head>
    <body>
        
        <div id="flip">PANELI INDIRMEK ICIN TIKLA</div>
        <div id="panel">Geleceği Yazıyorum</div>
        
    </body>
</html>

Farenizle ilgili yere tıkladığınızda aşağı doğru kayarak açılan paneli göreceksiniz.