Question

我真的很喜欢Vice的第二列（在主页上看到）与其他内容一起滚动，就像常规列一样，然后当你到达该列的底部时，它会停止滚动而其余内容继续正常滚动。

我已快速查看代码，但这并不明显，用于实现此目的的技术是什么？是否可以对现有网站进行改造？

TIA。

Answer 1

我会尝试解释它是如何工作的。

首先，列的工作方式类似于常规列。示例css：

#regular
{
width:200px;
height:500px;
background:gray;
position:absolute;
top:0;
}

Vice使用jQuery检查您的滚动位置是否大于列的位置。如果这是真的那么css就改成了这样的东西：

position: fixed;
top:200px; //menu height

或

position: absolute
top: scroll.offset height.

然后该列与屏幕一起滚动。

如何动态更改css？示例代码：

var windowScreen = $(window);
var column = $("#regular");

//Call function if user scrolls
windowScreen.scroll(function() {

   if(windowScreen.scrollTop() == 200)
   {
       $("#regular").css({"position":"fixed", "top":"200px"});
   }

}

滚动停止滚动的列

1 个答案: