Etiket: delay

jQuery delay() Yöntemi

delay() Yöntemi;

Kuyrukta onu takip eden işlevlerin yerine getirilmesini geciktirmek için kullanılır. ‘fast’, ‘slow’ ve milisaniye üzerinden değerler alabilir.

Örnek

$("a").click(function(){
  $(".kutu1").delay(500).slideDown();
  $(".kutu2").delay(800).slideDown();
  $(".kutu3").delay(1100).slideDown();
});
$(".geri").click(function(){
  $(".kutu1").delay("fast").slideUp();
  $(".kutu2").delay("fast").slideUp();
  $(".kutu3").delay("slow").slideUp();
});

Codepen Ön izleme

Kullanım şekilleri;

.delay( duration [, queueName ] )

Posted on by Samed GÖZÜTOK 1

CSS3 animation-delay

animation-delay :

Animasyonun yapılacağı süreyi belirler. Gecikme süreside denilebilir.

Örnek

div {
    width: 100px;
    height: 100px;
    background: green;
     color: white;
      position: relative;
    -webkit-animation: mymove 5s infinite; /* Chrome, Safari, Opera */
    animation: mymove 5s infinite;
    -webkit-animation-delay: 3s; /* Chrome, Safari, Opera */
    animation-delay: 3s;
}
/* Chrome, Safari, Opera */
@-webkit-keyframes mymove {
    from {top: 0px;}
    to {top: 200px;}
}

@keyframes mymove {
    from {top: 0px;}
    to {top: 200px;}
}

Codepen Ön izleme

 

Css Sözdizimi

Değer Açıklama
time İsteğe bağlı. Önce beklenecek süre tanımlanır. Varsayılan değer 0 dır. Negatif değerlere izin verilir.
İnital
İnherit

Tarayıcı Desteği
43.0
4.0-webkit		 16.0
5.0-moz		 10.0 9.0
4.0-webkit		 30.0
12.0-o
15.0-webkit
Posted on by Samed GÖZÜTOK 0

CSS3 transition-delay

transition-delay :

Uygulanan geçiş efektinin ne kadar zaman sonra başlayacağını belirler. Belirlenen zamana kadar animasyonu durdurur ve sonra animasyon başlar. Geçiş-gecikme değeri saniye (s) veya milisaniye (ms) tanımlanır.

Örnek

div {
  background: green;
  width: 200px;
  height: 20px;
  transition: height 2s;
  -webkit-transition: height 2s; /* Safari 3.1 to 6.0 */
  -webkit-transition-delay: 3s; /* Safari */
   transition-delay: 3s;
}
div:hover {
  height: 100px;
}

Codepen Ön izleme

 

Css Sözdizimi

Değer Açıklama
Time Geçiş efekti başlamadan önce beklenecek saniye ya da milisaniye sayısını belirlemek için kullanılır.
İnital
İnherit

Tarayıcı Desteği
26.0
4.0-webkit		 16.0
4.0-moz		 10.0 6.1
3.1-webkit		 12.1
10.5-o
Posted on by Samed GÖZÜTOK 0