ページの下部にドロップダウンメニューがあります。ユーザーがクリックすると、ページがメニューコンテンツの一番下まで自動的にスクロールダウンするようにします。現在、ユーザーはメニューを開いたときに手動でページを下にスクロールする必要があります。最初はアンカーを使おうとしましたが、ドロップダウン機能が壊れてしまうので、ボタンのままにしておきたいと思います。
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;
}
このJSを試してください:
$(document).ready(function() {
$('.dropdown-toggle').dropdown();
$('.dropdown-toggle').on('click',function(){
var height = $(document).height();
$(window).scrollTop(height);
});
});
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加