0

我试图让 servicewrapper div 只滚动到某个高度并停在那里。而且你不能在页面上滚动更多。

我从这段代码开始：

$(window).scroll(function() {   
 if ($(window).scrollTop() >=380) 
{ 
    $(window).scrollTop(380); 
}
});

它成功了，直到我注意到它停止了所有页面上的所有滚动。所以我尝试了这段代码，以便该规则仅适用于 servicewrapper div，但没有运气。如您所见，我不是 jquery 专家，呵呵。

$(window).scroll(function() {
 if $('#servicewrapper').scrollTop() >=380) 
{ 
    $('#servicewrapper').scrollTop(380); 
}
});

有没有办法做到这一点？一直在谷歌和堆栈上搜索对此的答案，但我没有找到任何答案，至少不是我想要的那样，而且我太菜鸟了，无法更改别人的代码。

先谢谢了！

4

2 回答 2

0

如果要控制容器内的滚动，则需要调用scrollTop该容器。在这种情况下，您似乎正试图影响向下滚动整个页面，因此您的容器将是window. 这部分是正确的。

如果我理解正确，这个脚本被插入到您网站的多个页面中，您只想影响某些页面。如果是这种情况，您需要以某种方式识别该页面。如果只有目标页面有一个名为 的元素servicewrapper，那么您可以使用它：

if($('#servicewrapper').length) {
    $(window).scroll(function() {   
        if ($(window).scrollTop() >=380) { 
            $(window).scrollTop(380); 
        }
    });
}

工作示例：http: //jsfiddle.net/MafPQ/

于 2012-11-12T20:11:23.493 回答
0

我让它工作了！它最初只能在 Firefox 中运行，但经过一些调整后，它可以在 IE、Safari、Firefox 和 Chrome 上运行。这是代码：

JS：

$(window).scroll(function(){
    if  ($(window).scrollTop() > 200){
         $('#servicediv').css({position:'relative',top:200});
    } else {
         $('#servicediv').css({'top':30% });
        }
});

和CSS：

#servicediv {
margin-top: 100px;
top:80%;
width: 100%;
background:url(images/content_bg.png);
height: auto;
position: relative;
z-index: 800;
bottom: 0;
min-height: 450px;

}
#servicewrapper {
width: 100%;
margin-left: auto;
margin-right: auto;
text-align: center;
height: auto;

}

我回答我自己的问题，以防其他人有同样的问题并用谷歌搜索。您必须调整规则以匹配您的 ofc。我猜你们中的很多人在看到代码时都会脸红。但它的工作。

于 2012-11-14T23:36:26.583 回答