setTimeout的问题(Issues with setTimeout)
我正在使用TweenLite来完成一些SVG动画,但由于某种原因,每次我重新加载页面时,第一次将动画元素悬停在元素上时,动画的瞬间即时。 然后在第一次立即添加悬停效果后,动画正常工作。
只需重新加载页面,将鼠标悬停在对象上,您将看到我收到的错误。
$('svg').hover(function() { /* Stuff to do when the mouse enters the element */ var currentCirc = $(this).find('.social-circle'); currentCirc.stop() .animate({'stroke-dashoffset': 0}, 1000); TweenLite.to(currentCirc, 1, {fill:'rgb(144, 17, 133)'}); console.log('on'); }, function() { /* Stuff to do when the mouse leaves the element */ var currentCirc = $(this).find('.social-circle'); currentCirc.stop() .animate({ 'stroke-dashoffset': 900 }, 1000); TweenLite.to(currentCirc, 1, {fill:'none'}); // .css('fill', 'none'); });
谢谢你的时间!
I am using TweenLite to complete some SVG animations, but for some reason every time i reload the page, the first time I hover the element with the animation, the durration of the animation is instant. Then after the first time the hover effect is added instantly, the animation works properly.
Just reload the page, hover the object and you will see the error I am receiving.
$('svg').hover(function() { /* Stuff to do when the mouse enters the element */ var currentCirc = $(this).find('.social-circle'); currentCirc.stop() .animate({'stroke-dashoffset': 0}, 1000); TweenLite.to(currentCirc, 1, {fill:'rgb(144, 17, 133)'}); console.log('on'); }, function() { /* Stuff to do when the mouse leaves the element */ var currentCirc = $(this).find('.social-circle'); currentCirc.stop() .animate({ 'stroke-dashoffset': 900 }, 1000); TweenLite.to(currentCirc, 1, {fill:'none'}); // .css('fill', 'none'); });
Thanks for your time!
原文:https://stackoverflow.com/questions/34907237
更新时间:2023-05-29 13:05