javascript - Can't transition between scale 0 and 1 with css transitions -


I want to create an image that is scaled down all the way in X, and then alert all the methods in X Doing classes (through javascript) are adding the pattern I use, works well for things like rotation, but I'm thinking that it only runs a full 360 degree. I'm not sure why this works:

CSS:

  .scaleXStart {visibility: hidden; Z-index: 0; Consequently scaleX (.5); } .scaleXEnd {z-index: 3; Consequently scaleX (2); Transition: 1s conversion; }  

Javascript:

  a = document.query selector ('# myDiv'); A.className = 'scaleXStart'; A.className = 'scaleXEnd';  

I thought it would work because it is adding and then a square is removed, so set the value to scaleX to 0 and then 1 Will be done but it is not working. Thanks for any thoughts

The problem is, the chance of getting a starting class is never met It goes straight to the end class, putting the change of the last class into a timeout (even zero milliseconds!) Will move it in both classes to change:

  Function animation ( ) {A = document.query selector ('# myDiv'); A.className = 'scaleXStart'; SetTimeout (function () {a.className = 'scaleXEnd';}, 0)} function ANNi2 () {a = document.query selector ('# myDiv'); A.className = 'scaleXStart'; A.className = 'scaleXEnd'; }  

See what I mean here:


Comments

Popular posts from this blog

sqlite3 - UPDATE a table from the SELECT of another one -

c# - Showing a SelectedItem's Property -

javascript - Render HTML after each iteration in loop -