Question

我想创建一个带有jquery动画的滑块，我想不出如何旋转和动画下面的元素这里是我的HTML

 <div id="slider">
      <a href="http://somthing/" target="_blank">
        <img src="http://something/logosponso.jpg" title="Another" />
      </a>
      <a href="http://somthing2/" target="_blank">
        <img src="http://something/logosponso2.jpg" title="Another" />
      </a>
     …
     …

我在css中隐藏了第一个标签

  #slider a{
    display: none;
  }

我想要发生的是在延迟4秒之后我淡入或滑入一些动画下一个标签并隐藏当前。我想这样做，直到我到达最后一个标签，然后我想回到第一个标签

到目前为止，我有这个，不确定我是否朝着正确的方向前进......任何想法？

$("#slider a").fadeIn(500).delay(3000)

Answer 1

$("#slider a:first").show();

$('#slider a').click(function(e) {
   e.preventDefault();
   $(this).hide();
   if ($(this).is('#slider a:last')) {
      $('#slider a:first').fadeIn(500);
   } else {
      $(this).next().fadeIn(500);
   }
});

我实际上不明白你需要什么。但是，如果您想在页面$(document).ready(...上显示，可以尝试下面的代码并根据需要进行修改：

$(document).ready(function() {
   $('#slider a').each(function() {
      if ($(this).is('#slider a:first')) {
         $(this).fadeIn(500);
      } else {
         if ($(this).prev().not(':hidden')) {
            $(this).fadeIn(500);
         }
      }
   });
});

jQuery滑块动画

1 个答案: