divcss滚动条内部内容锚点定位jQuery代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>div滚动条锚点定位</title>
<style>
div{ margin: 0px auto; }
.parentBox{
margin-top: 100px;
width: 960px;
height: 500px;
position: relative;
border:1px solid #ccc;
overflow: auto;
position: relative;
}
.innerBox{
margin-top: 100px;
width: 400px;
height: 500px;
position: relative;
border:1px solid #ccc;
}
ul{position: absolute;}
</style>
</head>
<body>
<ul>
<li>innerBox1</li>
<li>innerBox2</li>
<li>innerBox3</li>
<li>innerBox4</li>
</ul>
<div class="parentBox">
<div class="innerBox">innerBox1</div>
<div class="innerBox">innerBox2</div>
<div class="innerBox">innerBox3</div>
<div class="innerBox">innerBox4</div>
</div>
<script type="text/javascript" src="http://www.100sucai.com/js/jquery.js"></script>
<script type="text/javascript">
$(function(){
$("ul li").click(function(){
var i=$(this).index();
console.log(i)
$(".parentBox").scrollTop($(".innerBox")[i].offsetTop);
})
})
</script>
</body>
</html>
1230博客
热门推荐：