Jquery Css Funkcja wolno dodawać właściwość do div?

Question

Więc zasadniczo próbuję przeskalować element div (zaczyna się od 0), gdy kliknięto inny, ale początek skali powinien zaczynać się od miejsca kliknięcia. Rodzaj tego, co robi jabłko po kliknięciu aplikacji (aplikacja otwiera się od miejsca, w którym ją kliknąłeś).

Problem polega na próbie ustawienia właściwości początkowej skali, którą wykonuję pomyślnie, ale po kliknięciu elementu div nie ma to żadnego skutku! To działa tylko kiedy ustawić funkcję limitu czasu kiedy dodać klasę, która skaluje pełni pojawił

klasy zostały dodane przed css jest stosowany:

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"); 

Class jest stosowany z opóźnieniem (który skaluje od początku określony, ale potrzeba czasu)

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); 
} 

Czy mogę osiągnąć to samo bez funkcji timeout, dzięki!

Answer 1

Będziesz chcą wiązać się transitionend

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

można zobaczyć na skrzypcach js here