问SlideToggle内容与导航？
EN

Stack Overflow用户

提问于 2011-11-03 14:21:08

回答 1查看 354关注 0票数 0

我想通过在我的导航中按名称定位不同内容的div，从而滑动地切换其中的div。

我已经有了这个：

$(".div1, .div2, .div3").hide();

$(document).ready(function(){

    $("nav a").click(function () {  
    var divname= this.name;
    $("."+divname).siblings().slideUp(500, function () {
    $("."+divname).slideToggle();
});
});
});

<nav>
<a name="div1">SlideToggle Div 1</a>
<a name="div2">SlideToggle Div 2</a>
<a name="div3">SlideToggle Div 2</a>
</nav>

<div id="container">
<div class="div1">Content Div 1</div>
<div class="div2">Content Div 2</div>
<div class="div3">Content Div 3</div>
</div>

我希望每个div先向上滑动，然后用新div的内容向下滑动，这就是menue中的目标。

该脚本的问题：

有两个div就行了。增加第三个确实会使它向下滑动和向上滑动。增加一个forth可以使它向下滑动，向上滑动，向下滑动等等。兄弟姐妹的想法一定有什么问题吧？

谢谢。

jquery

slidetoggle

回答 1

Stack Overflow用户

回答已采纳

发布于 2011-11-03 14:35:23

有一个工作的小提琴页面，所以看看这。我对你的代码做了一些检查，看看这是否是你想要的。更新了代码，现在重试链接。

$(".div1, .div2, .div3").hide();
$(document).ready(function() {
  var firstTime = true;
  $("nav a").click(function() {
    var divname = this.name;
    if (!firstTime) {
        if ($(".slid").hasClass(divname)) {
            firstTime = true;
            $(".slid").removeClass("slid").slideUp();
        } else {

            $(".slid").removeClass('slid').slideUp(500, function() {
                $("." + divname).slideToggle().addClass("slid");

            });
        }
    } else {
        $("." + divname).slideDown().addClass("slid");
        firstTime = false;
    }

  });
});

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/7996450

复制

相似问题

问SlideToggle内容与导航？
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问SlideToggle内容与导航？EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问SlideToggle内容与导航？
EN