2015-05-12 23 views
5

Temel olarak, başka bir tıklandığında bir div (0'dan başlayarak) ölçeklemeye çalışıyorum ancak ölçek kaynağı tıklamanın gerçekleştiği yerden başlamalıdır. Bir uygulamayı tıkladığınızda elmanın yaptıklarına göre sıralama yapılır (uygulama, tıkladığınız yerden açılır).Jquery Css İşlev, özelliği div'a eklemek için yavaş mı?

Sorun, başarılı bir şekilde yaptığım, ancak kökeni tıklattığımda ölçek kökeni özelliğini ayarlamaya çalışıyor, bu bir etkisi yok!

var xPosSTR = 30+'px'; 
var yPosSTR = 30+'px'; 

     $('.box-detail').css({ 
      'transform-origin':   '' + xPosSTR + ' ' + yPosSTR + ' 0px', 
      '-webkit-transform-origin': '' + xPosSTR + ' ' + yPosSTR + ' 0px' 
     }); 

     $(".box-detail").addClass("box-reveal-prop"); 

Sınıf gecikmeyle uygulanır: Ben tamamen

Sınıf css uygulanmasından önce eklenmiş olan göründü Ben ölçekler sınıf eklediğinizde için zaman aşımı fonksiyonu ayarlamak zaman çalışır (zaman kökenli belirtilen ölçekler ancak alır)

var xPosSTR = 30+'px'; 
var yPosSTR = 30+'px'; 

     $('.box-detail').css({ 
      'transform-origin':   '' + xPosSTR + ' ' + yPosSTR + ' 0px', 
      '-webkit-transform-origin': '' + xPosSTR + ' ' + yPosSTR + ' 0px' 
     }); 
     setTimeout(function(){ 
      $(".box-detail").addClass("box-reveal-prop"); 
     }, 2000); 

cSS: {

.box-detail { 
    display: inline-block; 
    position: absolute; 
    height: 100%; 
    width: 100%; 
    transition: 0.3s; 
    z-index: 1000; 
    transform:scale(0,0); 
} 

.box-reveal-prop { 
    transform:scale(1,1); 
} 

Zaman aşımı işlevi olmadan aynı şeyi yapabilir miyim, Teşekkürler!

cevap

2

Sen js keman görebilirsiniz transitionend

$('.box-detail') 
    .bind("transitionend webkitTransitionEnd oTransitionEnd MSTransitionEnd", 
     function(){ 
      $(".box-detail").addClass("box-reveal-prop"); 
}); 

bağlamak isteyeyim here

İlgili konular