Question

点击链接后，如何使用scrollify库将网页转换为页面的特定部分。

<ul class="nav navbar-nav">
    <li><a href="#1" class="link">this is a link</a></li>
    <li><a href="#2" class="link">this is another link</a></li>
    <li><a href="#3" class="link">and another link</a></li>
</ul>

点击后，每一个都会将用户发送到下面显示的网页的某个部分。现在没有滚动，每个部分都没有软转换。

<h3 class="season" id="1"><span class="seasontext">SS17</span></h3>
<h3 class="season" id="2"><span class="seasontext">SS17</span></h3>
<h3 class="season" id="3"><span class="seasontext">SS17</span></h3>

这是一个scrollify模板，但我不太确定如何单独访问链接以及如何使用转换。

$.scrollify({
    section : "link",
    interstitialSection : "",
    easing: "easeOutExpo",
    scrollSpeed: 1100,
    offset : 0,
    scrollbars: true,
    standardScrollElements: "",
    setHeights: true,
    overflowScroll: true,
    updateHash: true,
    touchScroll:true,
    before:function() {},
    after:function() {},
    afterResize:function() {},
    afterRender:function() {}
});

$.scrollify.move("#season");

Answer 1

您可以编写点击事件来实现此目的，如下所示。

$('.link').click(function(){
  var moveTo = $(this).attr('href');
  $.scrollify("move",moveTo);
});

希望它有所帮助。

在链接上使用Scrollify

1 个答案: