• RSS
  • Facebook
  • Twitter
  • Linkedin

24 Temmuz 2014 Perşembe

JQuery Animasyon (Animate) Özellikleri



Animate: click özelliği atanan elemana tıklandığı an, animate özelliği atanan eleman çalışır.

Yön atamaları: click özelliği atanan elemana tıklandığı an,  (left, right, top, bottom)  sol, sağ, üst veya alt yönünde hareket eder.

  $(document).ready(function(){
  $("#button1").click(function(){
  $("#kutu1").animate({left:'500px'});
  });
  });

Saydamlık: click özelliği atanan elemana tıklandığı an, Opacity özelliğine atanan değer kadar saydamlaşır.

  $(document).ready(function(){
  $("#button2").click(function(){
  $("#kutu2").animate({opacity:'0.5'});
  });
  });

Toggle () :  click özelliği atanan elemana tıklandığı an, Toggle  özelliği atanan elemanı her tıklamada gösteri veya gizler.


$(document).ready(function(){
$("#button3").click(function(){
$("#kutu3").animate({height:'toggle'});
});
})


Birden fazla özelliği bir arada kullanmak

$(document).ready(function(){
$("button").click(function(){
 var div=$("div");
div.animate({height:'+=100px',opacity:'0.4'},"slow");
div.animate({width:'+=100px',opacity:'0.8'},"slow");
div.animate({height:'+=25px',opacity:'0.4'},"slow");
div.animate({width:'+=25px',opacity:'0.9',left:'+=150px'},"slow");
});
});

çalışmalara ait örnek link


0 yorum:

Yorum Gönder