Don't like ads? PRO users don't see any ads ;-)
Guest

Untitled

By: a guest on May 7th, 2012  |  syntax: None  |  size: 0.97 KB  |  hits: 10  |  expires: Never
download  |  raw  |  embed  |  report abuse  |  print
Text below is selected. Please press Ctrl+C to copy to your clipboard. (⌘+C on Mac)
  1. Slow JavaScript animation in Chrome
  2. var a = document.createElement('div');
  3.  
  4. a.style.position = 'absolute';
  5. a.style.display = 'block';
  6. a.style.top = '300px';
  7. a.style.left = '50px';
  8. a.style.height = '100px';
  9. a.style.width = '10px';
  10. a.style.backgroundColor = '#000000';
  11. a.style.zIndex = '200';
  12.  
  13. a.aW = 10;
  14.  
  15. var a2 = document.createElement('div');
  16.  
  17. a2.style.position = 'absolute';
  18. a2.style.display = 'block';
  19. a2.style.top = '200px';
  20. a2.style.left = '50px';
  21. a2.style.height = '100px';
  22. a2.style.width = '10px';
  23. a2.style.backgroundColor = '#000000';
  24. a2.style.zIndex = '200';
  25. a2.id = 'a';
  26.  
  27. a2.aW = 10;
  28.  
  29. document.getElementsByTagName('body')[0].appendChild(a);
  30. document.getElementsByTagName('body')[0].appendChild(a2);
  31.  
  32. var b = window.setInterval(function () {
  33.     a.aW += 10;
  34.     if (a.aW > 1600) {
  35.         window.clearInterval(b);
  36.     }
  37.     a.style.width = a.aW + 'px';
  38. }, 13);
  39.  
  40. $('#a').animate({
  41.     width: '1600'
  42. }, 2000, 'linear');
  43.        
  44. document.getElementsByTagName('body')[0]
  45.        
  46. document.body