幻灯片切换 - jQuery

Question

我已经构建了一个滑动的DIV与几个锚，点击时，我想显示其相应的DIV。

然而，当你点击操作时，它有点bug。当然有更好的方法来做到这一点？我不认为自己构建得非常好，所以任何人都可以提出倾向性，或者让一个项目被点击时隐藏其他项目。

起初我还需要金融DIV表示正提供是一个痛苦......

http://jsfiddle.net/MZNyC/

Answer 1

我建议你创建一个会持什么样的当前显示的变量。点击标签后，它会隐藏当前标签，显示新标签，然后将新标签设置为当前标签。

我已经修改了你的提琴进行论证：http://jsfiddle.net/t0nyh0/MZNyC/20/

Answer 2

您可以在按钮使用的onClick（）事件，并使用功能废话按钮并在按钮被点击时重新使用它。所以如果你添加另一个按钮，在函数中传递参数（按钮来完成“切换”）。

问候

Answer 3

http://jsfiddle.net/MZNyC/21/

不要使用切换，调用siblings.hide（）每个面板开关。

裹在一个包含分区面板（所以兄弟姐妹（）。隐藏（）只隐藏其他面板，而不是头）

Answer 4

有一个处理程序的各个环节来管理这个简单的方法。您所需要的只是一种创建链接和内容之间关系的方法。这是一种通过向链接添加一个属性的方法。随后，可以设置只定义当前的一些类名，使其容易滑动备份

HTML：

<a class="finance-btn titlejob" href="#" data-class="finance"> 

JS：

$('.titlejob').click(function() { 
    var newContent = $('.' + $(this).data('class'));; 
    $('.content_active').removeClass('content_active').slideToggle("slow", function() { 
     newContent.slideToggle("slow").addClass('content_active'); 
    }); 
return false; 
});