Web Programlama

Web Programlama

DERS PROGRAMI
Web Programlama 302 Ders Programı
Sınava Gir

jQuery toggle() Fonksiyonu

Lisans: Creative Commons 26.11.2020 tarihinde güncellendi
Bakabileceğiniz Etiketler: Eğitmen: Geleceği Yazanlar Ekibi

jQuery ile toggle() metodunu kullanarak, hide() ve show() metotları arasında geçişler sağlayabilirsiniz; böylece seçilen eleman bir görüntülenir bir gizlenir ve bu geçişler devam eder.

Örneğimizi hep birlikte inceleyelim:

$("button").click(function(){
  $("p").toggle();
});

 

Yazılış biçimi

$(seçici).toggle(hız,geriçağır);

Parametrelerin anlamı ve işlevi yukarıda açıklandığı gibidir.

Toggle fonksiyonuna ö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(){
                              $("button").click(function(){
                                                $("p").toggle();
                                                });
                              });
            </script>
    </head>
    <body>
        
        <button>GIDIS-GELISLER</button>
        <p>Geleceği Yazanlar yazısı</p>
        <p>Her düğmeye basıldığında gelip gider</p>
    </body>
</html>

GİDİŞ-GELİŞLER düğmesine tıklayınca iki satır silinecek, tekrar tıklayınca geri gelecektir.

Sınava Gir