我看的脑袋疼,这小段代码到底哪里出问题了?

diamond_k 2018-07-08 10:41:17

<!doctype html>

<html>

 <head>

	<meta charset="UTF-8">

	<title>根据页面滚动位置显示浮动框</title>

	<style>

		body{height:2000px;}

		#toTop{

			position:fixed;

			bottom:100px;

			right:0;

			display:none;

		}

	</style>

 </head>

 <body>

	<div id="toTop">

		<a href="#">返回顶部</a>

	</div>

	<script>

        var div=document.getElementById("toTop");

        document.body.onscroll=function() {

            if (document.body.scrollTop >= 500)

                div.style.display = "block";

            else

                div.style.display = "none";

        }

	</script>

 </body>

</html>

需求是滚动超过500的时候,显示div标签内容,为啥我这里就是没反应... 哭.
求解,谢谢高手

...全文

112 6 打赏收藏转发到动态举报

写回复

用AI写文章

6 条回复

切换为时间正序

请发表友善的回复…

发表回复

diamond_k 2018-07-08

打赏
举报

引用 5 楼 ambit_tsai 的回复:

指不定内核版本不一样，前端有各种奇怪的兼容问题，习惯就好

总之很感谢, 哦,我用 navigator.userAgent 特意测试了一下 UC和 chrome的内核, Chrome版本更新一些 ,2者内核一致.
好了给分,,,谢谢,有劳啦

ambit_tsai-微信 2018-07-08

打赏
举报

引用 4 楼 diamond_k的回复:

[quote=引用 3 楼 ambit_tsai 的回复:]
document.body，返回html dom中的body节点；
document.documentElement，返回html dom中的root 节点即<html>；
不同浏览器表现不同，可以一起用，提高兼容性；
document.body.onscroll = function(){

	var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;

	if (scrollTop >= 500)

		div.style.display = "block";

	else

		div.style.display = "none";

}

感谢,测试之后确实没问题了, IE11依然不支持. 用chome测试需要用html.csrollTop的形式才有效,不过很奇怪的是闲来无事用 UC浏览器居然,不需要这个html的兼容也可以读取到body上, 更奇怪的是uc用的和chome一个内核版本[/quote] 指不定内核版本不一样，前端有各种奇怪的兼容问题，习惯就好

diamond_k 2018-07-08

打赏
举报

引用 3 楼 ambit_tsai 的回复:

document.body，返回html dom中的body节点；
document.documentElement，返回html dom中的root 节点即<html>；
不同浏览器表现不同，可以一起用，提高兼容性；
document.body.onscroll = function(){

	var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;

	if (scrollTop >= 500)

		div.style.display = "block";

	else

		div.style.display = "none";

}

感谢,测试之后确实没问题了, IE11依然不支持. 用chome测试需要用html.csrollTop的形式才有效,不过很奇怪的是闲来无事用 UC浏览器居然,不需要这个html的兼容也可以读取到body上, 更奇怪的是uc用的和chome一个内核版本

ambit_tsai-微信 2018-07-08

打赏
举报

document.body，返回html dom中的body节点；
document.documentElement，返回html dom中的root 节点即<html>；
不同浏览器表现不同，可以一起用，提高兼容性；



document.body.onscroll = function(){

	var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;

	if (scrollTop >= 500)

		div.style.display = "block";

	else

		div.style.display = "none";

}