window.jump_animate = function() { test.style.display = "none"; test.style.left = "100px"; test.style.display = "block"; test.style.left = "20px"; } window.jump_animate_fix = function() { test.style.display = "none"; getComputedStyle( test ).display; test.style.left = "100px"; test.style.display = "block"; getComputedStyle( test ).display; test.style.left = "20px"; } var test = document.getElementById("test");
<div id="test"></div> <input type=button onclick="jump_animate()" value="try to jump and animate" /> <input type=button onclick="jump_animate_fix()" value="jump and animate with fix" />
#test { position: absolute; top: 50px; left: 20px; width: 30px; height: 30px; background: #B3B; -webkit-transition: left .6s; -moz-transition: left .6s; transition: left .6s; }