セマンティックUIのメニューにスクロール

Question

私は右上隅に固定されているメニュー用のセマンティック-UIを使用していて、それがここに示すようにページが、長い場合であっても、そこにとどまる：

http://jsfiddle.net/psychomachine/03pfvhzs/1/

<div class="ui top attached demo menu"> 
    <a class="header item"> 
     Blah 
    </a> 
    <a class="right item tS"> 
     <i class="sidebar icon"></i> 
     Menu 
    </a> 
    </div> 
    <div class="ui bottom attached segment pushable"> 
    <div class="ui inverted labeled icon right inline vertical sidebar menu"> 
      <a class="item"> 
      <i class="home icon"></i>Home 
      </a> 
      <a class="item"> 
      <i class="block layout icon"></i> 
      Topics 
      </a> 
      <a class="item"> 
      <i class="smile icon"></i> 
      Friends 
      </a> 
      <a class="item"> 
      <i class="calendar icon"></i> 
      History 
      </a> 
     </div> 


    <div class="pusher"> 

     <div class="ui main text container"> 
     <p>stuff</p> 
     etc. etc. etc. 
     <p>end of stuff</p> 
     </div> 
     </div> 

問題は以下の通りです：ページが長い場合には、実際にメニューが表示されません右上のメニューリンクをクリックし、jsfiddleで（あなたが「ものの終わり」までスクロールダウンしている場合）、メニューには項目が不足しているだけなので、空のスペースしか使用できません。

ユーザーがメニューリンクをクリックするたびにページを上にスクロールしたいと思いますが、$（window）.scrollTop（）を使用しようとしましたが役に立たなくなりました。

メニューにスクロールする方法についてのヒントは非常に高く評価されます。あなたはここでは、この

jQuery('.menu-toggle').on('click', function() { 
    $(this).toggleClass('is-active'); 

    if($(this).hasClass('is-active')) { 
    jQuery('.bottom.segment').animate({ 
     scrollTop: $(".sidebar.menu").offset().top 
    }, 600); 
    } 
}); 

ような何かを行うことができ、迅速かつソリューションのよう

Answer 1

が更新JSフィドルは次のとおりです。http://jsfiddle.net/03pfvhzs/2/