Question

我在我的一个项目中使用了顶部滚动。

以下是我的urls.py： -

urlpatterns = [
url(r'^(?i)$','project.views.home', name="home"),
url(r'^(?i)all/$','project.views.about', name="about"),
url(r'^(?i)blog/$','project.views.blog', name="blog"),
url(r'^(?i)contact/$', 'project.views.contact', name="contact")

现在，我在页面下面有一个横幅，其中有3个类别，博客和联系方式。

当我打开页面主页时，横幅显示在下面，其中显示了3个类别，并且显示了“约”字段（如带下划线的粗体文本）。现在，当我点击about时，页面会在横幅下方向上滚动。以下是我用过的JS代码： -

if((urlPath.match(/\/all//i)))
 {
 $(function() {
     $('html, body').animate({
        scrollTop: $('.banner').height()}, 400);
        });
 }

P.S：banner是包含图像的类名

现在，类别部分位于页面顶部。

现在我想要的是如果我选择博客或联系人他们被自动滚动到顶部，就像目前如果在上面的条件我给博客和联系的部分，滚动再次发生。有什么帮助吗？

Answer 1

您可以为所有链接提供一个公共类和数据属性，如：

<a href="..." class="scroll-link" data-scroll-to="ID_of_element_you_want_to_scroll_to">...</a>

然后你可以在页面加载时使用它：

$('.scroll-link').click(function() {
    var scrollTo = $(this).data('scroll-to');
    $('html, body').animate({
        scrollTop: $('#' + scrollTo).offset().top}, 400);
    });
});

如何在django页面加载前自动滚动网页？

1 个答案: