我最近承担了在Javascript / jQuery中构建动画的任务。动画由围绕伦敦地图移动的圆圈组成。每次通过一个电台时,电台名称都带有下划线。
我仍在努力改进它,并注意到当标签处于非活动状态时,如果在返回页面时混淆了序列的时间。因为我将其嵌入iframe中当我使用$(window).focus()
或$(window).blur()
时,它似乎无效。
我使用jQuery animate函数为圆圈设置了动画,并简单地在文本下的所有行上设置了不透明度0,并为它们添加了延迟,以便将不透明度设置为100。 我在下面放了一个链接来显示动画。我目前正在调整的动画仍有问题,但我不知道如何修复非活动标签问题。任何帮助都会很棒。
withoutframe: http://www.gbutlercreative.co.uk/london/index.html
带框架的答案 0 :(得分:1)
我认为您可以使用动画回调函数,但您必须重新编码所有逻辑:
$(".icon")
.animate({left:'+=23px',top:'+=23px'},500,'linear',function(){$(".Chesham").animate({opacity:1},10);})
.animate({left:'+=22px'},500,'linear',function(){$(".Chalfont").animate({opacity:1},10);})
为所有人做同样的事。