Question

使用jQuery隐藏切换...基本上我正在尝试做手风琴但客户希望能够同时打开多个内容区域。

一切顺利，但我无法弄清楚如何控制文本动画的外观。理想情况下，我只是希望它从标题下方向下滑动。它似乎从右下角出现。

这是我的HTML：

<div id="accordion">

  <h3 class="dropdown dropdown-default-on">About Me</h3>
  <div id='about-div'>
    <p>Some info about Me. Lorem ipsum dolor sit amet.</p>
  </div>

  <h3 class="dropdown">My Skills</h3>
  <div id='about-div'>
    <p>Some info about my Skills. Lorem ipsum dolor sit amet.</p>
  </div>

</div>

Here's my jsfiddle

Answer 1

也许使用slideToggle()代替：

http://jsfiddle.net/isherwood/9hmhU/5

jQuery(function () {
    $('.dropdown').click(function () {
        $(this).next().slideToggle(300);
    });
});

其他说明：我删除了一些似乎没有做任何事情的代码。此外，您有重复的ID值，这是不允许的。最后，TidyUp按钮是你的朋友。： - ）

Answer 2

更新了你的小提琴

Have a look

这是更新后的代码

jQuery( function() {
     $('.dropdown').click(function() {
         if($(this).next().is(":visible")){
    $(this).next().slideUp(300);
         }
         else{
         $(this).next().slideDown(300);
         }
    return false;
  } ).next().hide();

    $('.dropdown-default-on').next().toggle(300);

       } );

div从左下方进入而不是下降

2 个答案: