0

我在同时打开/关闭 div 时遇到问题。我已经阅读了很多关于它的内容并尝试了一切,但似乎没有任何效果......这就是它应该看起来的样子:

演示

这是我得到的代码。它与一个 DIV 完美配合:

$(document).ready(function(){

    $(".slidingDiv").hide();
    $(".show_hide").show();

$('.show_hide').click(function(){
$(".slidingDiv").slideToggle();
}); });

我希望这适用于 3 个或更多 div:一旦单击新链接并且 div 出现幻灯片,当前打开的 div 就会以幻灯片关闭。

很高兴收到你的来信:-) 非常感谢!!

4

2 回答 2

0

$(".slidingDiv2").slideToggle(); try adding this line. hope it may help.

ok i didnt got you at the first time so i just posted that part: add this $('.menu').click(function(){ $(".slidingDiv").slideToggle(); $(".slidingDiv2").slideToggle(); }); this will help. actually what your code is doing at first is only clicking with class show_hide. if you want your hyperlink to work you have use the class on hyperlinks.

于 2012-09-21T10:13:38.913 回答
0

如果我理解正确,我认为您追求的是这样的:

$('a.link').on('click', function(e) {

  e.preventDefault();
  var slideSelector = '#' + $(this).attr('id').replace('link', 'slide');

  // slide down the div which corresponds to the clicked anchor,
  $(slideSelector).slideDown(500, function() {
    // slide the rest up
    $('div.slide').not($(slideSelector)).slideUp(500);
  });

  // or do it in the reverse order
  $('div.slide').not($(slideSelector)).slideUp(500, function() {
    $(slideSelector).slideDown(500);
  });      

});

这是我用于上述示例的标记:-

<a id="link1" class="link" href="#">Link 1</a>
<a id="link2" class="link" href="#">Link 2</a>
<a id="link3" class="link" href="#">Link 3</a>

<div class="slide" id="slide1">Slide Example #1</div>
<div class="slide" id="slide2">Slide Example #2</div>
<div class="slide" id="slide3">Slide Example #3</div>

请注意,<a>'s 和<div>'s 都被赋予了id's,它们用于将两者联系在一起(看看slideSelector)。

这是一个小提琴,每次单击链接时都会在上述每个示例之间切换

这只是一种方法,例如另一种方法是将链接和 div 包装在单独的容器中,然后使用index()来选择与单击的链接相对应的 div,但是链接和 div 必须以相同的顺序出现以使其正常工作。

于 2012-09-21T10:50:30.873 回答