Question

我试图使用jquery航点来产生一些粘性导航，但我遇到了问题。

在页面上

<script src="js/waypoints-sticky.min.js"></script>
<script src="js/waypoints.js"></script>
<script src="js/waypoints-sticky.js"></script>
<script type="text/javascript" charset="utf-8">


    $(document).ready(function(){
         $(window).resize(function(){
             $('#mainsplash').css("height", ($(window).height() - 200) + "px");
         });
         $('#mainsplash').css("height", ($(window).height() - 200) + "px");
         $('.sticky1').waypoint('sticky', {
          offset: 0 // Apply "stuck" when element 30px from top
        });
    });


</script>

CSS

.stuck{position: fixed; top: 0;}

问题1：似乎不适用于div？如果我在课堂上申请一个div＆＃34; sicky1＆＃34;它什么都不做。但是，当我申请课程时，＆＃34; stick1＆＃34;到H1或A标签它的工作原理。有没有办法在div上使用它？

Issue2：有没有办法将粘性应用于多个元素，然后当它们到达顶部时让它们位于另一个元素之下。

基本上我试图做的是创造一个手风琴效果。所以我要说我的页面有3个部分。

PRODUCT - 内容关于 -内容联系 -content。

当用户滚动到底部时，这三个部分应该粘在页面顶部下方。

即。（这些应该紧挨着下一个） PRODCUT 关于 CONTACT

内容 - -footer -

希望这是有道理的。 Jquery不是我的强项。

Answer 1

没关系，我明白了。我不确定为什么它没有在div上工作，但它突然开始工作了。通过在div上的css中设置margin-top和jquery中的偏移量，我能够实现手风琴效果。

Jquery waypoint stickey问题

1 个答案: