js控制当滚动条到最底部时隐藏某个div
2个回答
展开全部
您好!具体代码如下,兼容各浏览器,其中scrollTop 为当前页面到顶部的距离,document.body.offsetHeight为整个页面的高度,document.documentElement.clientHeight为当前屏幕的高度,有不明白的可以问我,希望我的回答能帮到您!
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title> </title>
<style>
body{margin:0;height:2000px;}
div{height:500px;width:500px;background:#f00;margin:0 auto;}
</style>
<script>
window.onscroll=function(){
var scrollTop = document.documentElement.scrollTop||document.body.scrollTop;
if(scrollTop>=document.body.offsetHeight-document.documentElement.clientHeight)
{
document.getElementById("div1").style.display="none";
alert("去看看是不是DIV不见了");
}
}
</script>
</head>
<body>
<div id="div1">
this is a div
</div>
</body>
</html>
展开全部
<!doctype html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<script>
window.onscroll = function () {
var a = document.documentElement.scrollTop == 0 ? document.body.clientHeight : document.documentElement.clientHeight;
var b = document.documentElement.scrollTop == 0 ? document.body.scrollTop : document.documentElement.scrollTop;
var c = document.documentElement.scrollTop == 0 ? document.body.scrollHeight : document.documentElement.scrollHeight;
if (b != 0) {
if (a + b == c) {
hideMyObj();//到底部则,执行hideMyObj函数来隐藏指定id的元素
}
}
}
function hideMyObj () {
document.getElementById("myobj").style.display = "none";
}
</script>
<style>
p{
width: 200px;
height: 1300px;
background: red;
}
</style>
</head>
<body>
<p id="myobj">把动滚动条拖到最下面..</p>
</body>
</html>
<html lang="zh-cn">
<head>
<meta charset="utf-8">
<script>
window.onscroll = function () {
var a = document.documentElement.scrollTop == 0 ? document.body.clientHeight : document.documentElement.clientHeight;
var b = document.documentElement.scrollTop == 0 ? document.body.scrollTop : document.documentElement.scrollTop;
var c = document.documentElement.scrollTop == 0 ? document.body.scrollHeight : document.documentElement.scrollHeight;
if (b != 0) {
if (a + b == c) {
hideMyObj();//到底部则,执行hideMyObj函数来隐藏指定id的元素
}
}
}
function hideMyObj () {
document.getElementById("myobj").style.display = "none";
}
</script>
<style>
p{
width: 200px;
height: 1300px;
background: red;
}
</style>
</head>
<body>
<p id="myobj">把动滚动条拖到最下面..</p>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询