jQuery Göster - Gizle Uygulaması

jQuery web uygulamalarında işimizi kolaylaştıran, çok  kısa kodlar ile bir çok işlem yapmamızı sağlayan bir kütüphanedir.

Bugün bu kütüphanede standart bir div'i gösterip - gizlemesini anlatıcam.

Öncelikle jquery kütüphanesini sitemize ekliyoruz

<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>

Ardından  divi oluşturuyoruz.

<div id="kutu" style="width:100px;height:100px;background-color:#000;"></div>

Div şuan gözüküyor biz bunu gizlemek için bir link tanımlıcaz ve o linke tıklanınca div kaybolcak kaybolması için ise fadeToggle fonksiyonunu kullanıcaz.

<script>

 $(document).ready(function(e) {

        $("#kapat").click(function(){

   $("#kutu").fadeToggle(500);

   });

    });

</script>

Burda id'si kapat olan linke tıklandığında sitedeki id'si kutu olan divler görünür durumda ise kapanıcak, görünmez ise açılıcaktır.


DEMO

Göster Gizle