Question

使用jquery，我无法获得链接工作并为锚点的背景设置动画。似乎其中一个或另一个有效。

这是标记：

   <ul class="nav">
   <li> <span id="background"> </span><span id="active"></span><a href="page1.html"     
   class="active">page 1</a> </li>
   <li> <a href="page2.html">page 2</a> </li>
   </ul>

这是用于点击操作但不是动画效果的jquery代码：

$("ul.nav a").click(function () {
     $("span#background").fadeIn(800, function () {});
     $("#active").animate({left: "+=2410"}, 950)     
   });

“span”元素通过css具有背景图像，动态放置在活动侦听器中。因此，活动链接获得背景和飞入的动画图像。插入“return false”时在jquery代码的末尾，动画确实运行但单击操作被终止。

这是裸骨测试页面： link to testpage

感谢任何可以提供帮助的人！

Answer 1

我查看了您上面的代码以及您的测试页，问题是您希望只需单击一下即可让主播跟踪href并显示动画在同一时间。

有一个更好的解决方案。这是通过jQuery .hover()方法在鼠标悬停期间发生动画。参考HERE

使用.hover（）的 testpage 示例位于：jsFiddle

我冒昧地改变了动画片，但你应该把这个想法和我提出的许多评论理解为流程/概念。

如果.hover()方法不可接受，那么仍然可以对所有内容使用单个onclick，但在鼠标悬停期间不会发生任何动画。此jsFiddle使用.click()代替。

因为.hover()用于制作动画，所以anchor tag仍然可以在点击时正常运行。

使用jquery，我无法获得链接工作并为锚点的背景设置动画

1 个答案: