gpt4 book ai didi

javascript - 当部分高于屏幕高度时如何暂时禁用 "scrollify"

转载 作者:行者123 更新时间:2023-11-28 14:42:10 29 4
gpt4 key购买 nike

我正在尝试为我的网站使用 scrollify。它现在有三个页面(部分)。第二页(部分)比屏幕高度高,所以我想禁用“滚动”直到它到达第二页的底部。但是在我的代码中,当页面滚动一点点时,它会在到达第二页底部之前进入第三页。我该如何解决这个问题?我把我的部分代码放在这里

HTML

    <div class="main">
<section class="section js-section" data-section-name="section1">
<div class="section-content">
<p>XXX</p>
</div>
</section>

<section class="section js-section" data-section-name="section2">
<div class="section-content">
<div class="portfoliocontainer">
<img src="a.JPG" alt="a">
<img src="b.png" alt="b">
<img src="c.jpg" alt="c">
<img src="d.jpg" alt="d">
<img src="e.jpg" alt="e">
<img src="f.jpg" alt="f">
</div>
</div>
</section>

<section class="section js-section" data-section-name="section3">
<div class="section-content">
<h2>section 3</h2>
<p>ZZZ</p>
</div>
</section>
<ul class="pager" id="js-pager"></ul>
</div>

CSS

.main {
position: relative;
}
.section {
width: 100%;
max-height: 105%;
}
.section-content {
max-width: 80%;
margin: 0 auto;
padding: 40px 60px;
text-align: center;
}
.portfoliocontainer {
display: flex;
flex-wrap: wrap;
align-items: flex-start;
flex-direction: row;
max-height: 100vh;
margin-top: 5%;
}

JS

var $section = $('.js-section');
var $pager = $('#js-pager');

var option = {
section : '.js-section',
sectionName:false,
easing: "swing",
scrollSpeed: 600,
scrollbars: true,
overflowscroll: true,
interstitialSection: ".header",
before:function(index) {
pagerCurrent(index);
},
afterRender:function() {
createPager();
}
};

$(document).ready(function(){
$(".downarrow").click(function(){
$.scrollify.next();
});

$(".uparrow").click(function(){
$.scrollify.move();
});
});

$(function() {
$.scrollify(option);
});

最佳答案

你必须定义 afterRender 和 beforeRender 函数,它给控制台一个错误:

createPager(); pagerCurrent();

未定义。

https://codepen.io/neel555nc/pen/mzmgeG

关于javascript - 当部分高于屏幕高度时如何暂时禁用 "scrollify",我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52752166/

29 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com