-1

我有一个 jQuery 选择菜单列表，它作为弹出窗口打开，因为它太长了。我想要的是列表末尾的“返回顶部”按钮。我发现本教程看起来应该可以解决问题，只是它没有显示“返回顶部”文本，因为我认为它位于弹出窗口下方。任何想法如何解决这个问题？还是“回到顶部”解决方案的另一种实现？

4

1 回答 1

0

按部分分解。将<a href="#">Back to Top</a>自动将您置于页面顶部。这不是火箭科学。

然后你可以通过 CSS 添加一些样式。在这种情况下，本教程使用“回到顶部”类。<a href="#" class="back-to-top">Back to Top</a>. 你可以让它看起来像你想要的任何东西，没什么大不了的。

但是，我建议您保留这段代码，因为它是定位它的代码。position: fixed; bottom: 2em; right: 0px;. 作为旁注，替换position:fixed为position:relative，因此它会出现在弹出窗口中。

然后，您可以添加一些漂亮的平滑滚动效果或任何您想要的。

jQuery(document).ready(function() {
var offset = 220;
var duration = 500;
jQuery(window).scroll(function() {
    if (jQuery(this).scrollTop() > offset) {
        jQuery('.back-to-top').fadeIn(duration);
    } else {
        jQuery('.back-to-top').fadeOut(duration);
    }
});

jQuery('.back-to-top').click(function(event) {
    event.preventDefault();
    jQuery('html, body').animate({scrollTop: 0}, duration);
    return false;
})
});

告诉我进展如何。干杯，塞巴斯蒂安。

于 2016-10-07T04:25:01.277 回答