activer une transition css à l'aide de javascript

J'ai une img, et que je voudrais être en mesure de cliquer sur et de mon

.image_click:active {
  -webkit-transition-duration: 500ms;
  -webkit-transform: scale(1.5);
}

rester à l'échelle! Je me rends compte que css seul ne peut pas le faire, comme je l'ai réaliser la transition quand je clique, mais perdre quand je presse le bouton de la souris. Javascript est-il la solution pour cela? Est-il un css psudoclass qui peut faire cela, je ne le sais pas?

Ici est un meilleur exemple de ce que je veux activer

.image_flip { 
  -webkit-animation-name: box_walk; 
  -webkit-animation-duration: 1s; 
  -webkit-animation-iteration-count: 1; 
  -webkit-animation-timing-function: linear; 
} 
@-webkit-keyframes box_walk { 0% {} 100% { -webkit-transform:rotateY(180deg); } }

OriginalL'auteur thatmiddleway | 2010-06-09

  1. 8

    plutôt que de compter sur :active dans la feuille de style, faire une classe séparée avec le transforme.

    .image_click_clicked
{
    -webkit-transition-duration: 500ms;
    -webkit-transform: scale(1.5);
}

    puis ajouter un js cliquez sur gestionnaire d'événements pour votre élément

    <img src="foo.png" class="image_click" 
     onclick="this.className='image_click_clicked';" />

    semble bien fonctionner dans le navigateur chrome.

    Ceci est très similaire à ce que j'ai trouvé bit.ly/cUqwmR. Merci!

    OriginalL'auteur lincolnk