javascript - divはドロップダウンではなく左下から入ります

Question

トグルでjQuery hideを使用しています...基本的に私はアコーディオンをやろうとしていますが、クライアントは同時に複数のコンテンツ領域を開く機能を望んでいます。

すべて順調に進んでいますが、テキストのアニメーションの外観を制御する方法がわかりません。理想的には、ヘッダーの下からスライドさせたいだけです。右下からちょこちょこ出てくるようです。

ここに私の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>

これが私のjsfiddleです

Answer 1

あなたのフィドルを更新しました

見てみる

更新されたコードは次のとおりです

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);

       } );