Выпадающее меню прокрутки по клику

Question

У меня есть раскрывающееся меню внизу страницы. Когда пользователь нажимает на нее, я хочу, чтобы страница автоматически прокручивалась вниз до нижней части содержимого меню. В настоящий момент пользователю необходимо вручную прокручивать страницу при открытии меню. Сначала я пытался использовать привязки для этого, но это нарушает функциональность выпадающего списка, поэтому я хотел бы сохранить его как кнопку.

Я включил тестовый якорь в свой plnkr, который работает так, как ожидалось. Я также не понимаю, почему выпадающий контент появляется после теста div.

HTML

<div class="bottom btn-group"> 
    <button class="btn btn-primary dropdown-toggle" data-toggle="dropdown" type="button" 
    aria-haspopup="true" aria-expanded="false"> 
     Themes <span class="caret"></span> 
    </button> 
    <div class="dropdown-menu"> 
     <ul> 
      <li>Teal</li> 
      <li>Gray</li> 
      <li>Plum</li> 
      <li>Violet</li> 
     </ul> 
    </div> 
    <br /><br /><br /><br /> 
    <div id="test">test</div> 
</div> 

CSS

.bottom { 
    bottom: -890px; 
} 

Answer 1

попробовать это JS:

$(document).ready(function() { 
    $('.dropdown-toggle').dropdown(); 

    $('.dropdown-toggle').on('click',function(){ 
    var height = $(document).height(); 
    $(window).scrollTop(height); 
    }); 
});