Web Programlama

Web Programlama

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

jQuery stop() Metodu

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

jQuery stop() metodu, bir animasyon ya da efekti tamamlanmadan önce durdurur.

Yazılış biçimi:

$(selector).stop(stopAll,goToEnd);

Kullanımı isteğe bağlı olan stopAll parametresi, animasyon kuyruğunun temizlenip temizlenmeyeceğini belirler. Öntanımlı değer false'tur; bunun anlamı sadece aktif animasyonun durdurulacağıdır. Daha sonra kuyruktaki animasyonlar icra edilebilir. Kullanımı isteğe bağlı olan gotoEnd parametresi de mevcut animasyonun hemen tamamlanıp tamamlanmayacağını belirler. Öntanımlı değer false'tur.

Şimdi sırada basit bir örnek var:

$("#stop").click(function(){
  $("#panel").stop();
});

Dilerseniz, örnek bir HTML5 kodu içinde bu parametreleri nasıl kullanacağımızı inceleyelim:

<!DOCTYPE html>
<html>
    <head>
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
        <script>
            $(document).ready(function(){
                              $("#flip").click(function(){
                                               $("#panel").slideDown(4000);
                                               });
                              $("#stop").click(function(){
                                               $("#panel").stop();
                                               });
                              });
            </script>
 
        <style>
            #panel,#flip
            {
                padding:7px;
                text-align:center;
                background-color:#e5effc;
                border:solid 1px #c3cff3;
            }
        #panel
        {
            padding:60px;
            display:none;
        }
        </style>
    </head>
    <body>
 
<button id="stop">KAYDIRMAYI DURDUR</button>
        <div id="flip">ASAGIYA KAYDIR PANELINI TIKLA</div>
        <div id="panel">Hareketli panel</div>    </body>
</html>

Burada ASAGIYA KAYDIR PANELINI TIKLA düğmesine tıklanınca panel aşağıya doğru hareket edecektir. KAYDIRMAYI DURDUR düğmesine tıkladığınız anda ise panelin hareketi duracaktır.

Sınava Gir