单击导航项时,我希望相关 div 滚动到父 div 的顶部。我目前无法使其正常工作。我目前没有看到任何错误。我还在打字,因为似乎有一个荒谬的代码/文本规则。无论如何,这是我的代码:
$('.button-widget_scroll-nav a').on('click', function(e) {
$('.button-widget_scroll-nav .active').removeClass('active')
$(this).addClass('active')
$('button-widget_body').animate({
scrollTop: $($(this).attr('href')).position().top - 100
},500);
e.preventDefault();
})
<div class="button-widget_body">
<div id="fills" class="panel fills">
<h3>Fills</h3>
<a href="#" class="fill fill-up">Fill Up</a>
<a href="#" class="fill fill-down">Fill Down</a>
<a href="#" class="fill fill-right">Fill Right</a>
<a href="#" class="fill fill-left">Fill Left</a>
</div>
<div id="outlines" class="panel outlines">
<h3>Outlines</h3>
<a href="#" class="fill fill-up">Fill Up</a>
<a href="#" class="fill fill-down">Fill Down</a>
<a href="#" class="fill fill-left">Fill Left</a>
<a href="#" class="fill fill-right">Fill Right</a>
</div>
<div id="pills" class="panel pills">
<h3>Pills</h3>
<a href="#" class="fill fill-up">Fill Up</a>
<a href="#" class="fill fill-down">Fill Down</a>
<a href="#" class="fill fill-left">Fill Left</a>
<a href="#" class="fill fill-right">Fill Right</a>
</div>
<div id="slots" class="panel slots">
<h3>Slots</h3>
<a href="#" class="fill fill-up">Fill Up</a>
<a href="#" class="fill fill-down">Fill Down</a>
<a href="#" class="fill fill-left">Fill Left</a>
<a href="#" class="fill fill-right">Fill Right</a>
</div>
<div id="circles" class="panel circles">
<h3>Circles</h3>
<a href="#" class="fill fill-up">Fill Up</a>
<a href="#" class="fill fill-down">Fill Down</a>
<a href="#" class="fill fill-left">Fill Left</a>
<a href="#" class="fill fill-right">Fill Right</a>
</div>
</div>
<div class="button-widget_scroll-nav">
<a href="#fills">Fills</a>
<a href="#outlines">Outlines</a>
<a href="#pills">Pills</a>
<a href="#slots">Slots</a>
<a href="#circles">Circles</a>
</div>
问题是这一行:
$('button-widget_body').animate({
应该:
$('.button-widget_body').animate({
您想查找带有class="button-widget_body"
而不是的元素<button-widget_body />
。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句