使用jQuery'重置'功能，使插件工作

我正在使用jQuery图像库（在这种情况下，FlexSlider）在页面上呈现几个图库。一次只能查看一个。为了适应这种情况，我在单击缩略图后使用了fadeIn/fadeOut。问题是画廊休息。我试了几次，他们以不同的方式休息。我确信有一种方法可以“重置”插件，以防止它被打破。下面是我在做什么，其中，在页面上呈现多个滑块时，应根据现场工作：使用jQuery'重置'功能，使插件工作

的jQuery：

<script type="text/javascript" charset="utf-8"> 
     $(window).load(function() { 

     $('#main-slider').flexslider({ 
     animation:'fade', 
     directionNav:true, 
     controlsContainer: ".flex-container" 
     }); 

     $('#secondary-slider').flexslider({ 
     animation:'fade', 
     directionNav:true, 
     controlNav:true, 
     controlsContainer: ".flex-container" 
     }); 

     }); 

     $(function(){ 
     $('#main-slider,#secondary-slider').hide(); 

//1//  

    $('.gal_icon_1').click(function(){ 
     $('#secondary-slider').fadeOut(function(){ 
     $('#main-slider').fadeIn(); 
     }); 
    }); 

//2// 

    $('.gal_icon_2').click(function(){ 
     $('#main-slider').fadeOut(function(){ 
     $('#secondary-slider').fadeIn(); 
     }); 
    }); 

    }); 
    </script>

HTML：

<div class="container"> 
    <div id="main-slider" class="flexslider"> 
     <ul class="slides"> 
      <li> 
       <img src="images/BVL_CHANDRA-B_MM_2010_A3.jpg" /> 
      </li> 
      <li> 
       <img src="images/BVL_CHANDRA-BLUE_MM_2010_A3.jpg" /> 
      </li> 
      <li> 
       <img src="images/BVL_JEWELS_MM_2010_A3.jpg" /> 
      </li> 
     </ul> 
    </div>

至于简单地淡出一个滑块伸出并褪去另一个滑块。但是当我这样做时，它会变得不可靠。那么，有没有办法让滑块“重置”，让它在每个div上工作？

来源

2012-04-11 Adam

如果你能提供在jsfiddle中重现的问题，你的问题将更容易调试。 – Shad 2012-04-11 04:55:19

我认为问题在于你初始化滑块，然后隐藏它们。

插件代码启动并开始动画过程，然后尝试在隐藏的元素上设置动画。这导致jQuery崩溃。

从GitHub下载最新的代码（https://github.com/woothemes/FlexSlider/），您的问题应该使用您当前的实现进行修复。我最近添加了阻止逻辑，在滑块不可见时停止滑块执行操作。

来源

2012-04-11 05:33:01

梦幻般的工作。无论如何，你是如何发现这个问题的？看起来这是你第一次访问Stack Overflow ......哦，'animation：'slide'，slideDirection：'horizontal'，'function does not work。但是，淡出效果很好，所以我坚持使用它。谢谢您的帮助。 – Adam 2012-04-11 15:41:31

Twitter的机器人在其中发布了带有“flexslider”的推文，我可以随时搜索这些用户问题。 :) – 2012-04-11 15:45:45

漂亮的苍蝇。对你的关心很好。你家的祝福... – Adam 2012-04-11 15:51:03

使用jQuery'重置'功能，使插件工作

回答

相关问题