如何使left div在到达终点时固定,直到右边更大的div结束

时间:2016-09-28 01:14:22

标签: javascript jquery web

我有2个并行的div,当页面滚动并且特定的div到达它的末尾时我需要阻止它滚动但是继续滚动另一个div。 For better example see this website left Div How it Sticks

2 个答案:

答案 0 :(得分:0)

尝试this之类的内容。基本上每当页面滚动时,这将检查您在页面中的位置,并且可以基于此进行切换。我建议你一旦到达屏幕上的那个点(你想要修复的元素).addClass()

答案 1 :(得分:0)

你可以这样做。请参阅工作演示。

<!DOCTYPE html>
<html>
<head>
	<title></title>
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
	
</head>

<style type="text/css">
.left{
    width: 200px;
    height: 200px;
    background-color: orange;
    position: fixed;
    left: 0;
    top: 0;

}

.right{
    width: 400px;
    height: 1500px;
    background-color: gray;
    position: absolute;
    right: 0;
    top: 0;

}

.right h1{
    position: absolute;
    bottom: 0;
}


</style>


<body>

<div class="left">I am the left div</div>
<div class="right">I am the right div

<h1>bottom</h1>
</div>



<script type="text/javascript">


</script>




</body>


</html>

相关问题