码迷,mamicode.com
首页 > Web开发 > 详细

JS的scrollIntoView

时间:2017-05-15 18:21:21      阅读:217      评论:0      收藏:0      [点我收藏+]

标签:窗口   get   nbsp   htop   边框   auto   范围   meta   add   

scrollIntoView(alignWithTop)  滚动浏览器窗口或容器元素,以便在当前视窗的可见范围看见当前元素。如果alignWithTop为true,或者省略它,窗口会尽可能滚动到自身顶部与元素顶部平齐;如果alignWithTop为false,则元素下边框与视窗底部齐平

例:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>scrollIntoView</title>
<style type="text/css">
body{
height: 20000px;
}
#pink{
margin: 1000px auto 100px;
width: 100px;
height: 200px;
background-color: pink;
}
</style>
</head>
<body>
<button id="btn">点我</button>
<div id="pink"></div>
<script type="text/javascript">
document.getElementById(‘btn‘).addEventListener(‘click‘, function () {
document.getElementById(‘pink‘).scrollIntoView(true);
})
</script>
</body>
</html>

 

JS的scrollIntoView

标签:窗口   get   nbsp   htop   边框   auto   范围   meta   add   

原文地址:http://www.cnblogs.com/carriezhao/p/6857408.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!