-
顶顶顶顶顶顶顶顶顶顶查看全部
-
水水水水水水水水水水查看全部
-
完整源代码查看全部
-
源代码查看全部
-
滚动条设置查看全部
-
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <title>Javascript 回到顶部效果</title> <link rel="stylesheet" type="text/css" href="style.css" /> <script type="text/javascript" src="script.js"></script> </head> <body> <div class="box"> <img src="http://img1.sycdn.imooc.com//535e0ce800015b7511902787.jpg" /> </div> <a href="javascript:;" id="btn" title="回到顶部"></a> </body> </html>查看全部
-
、、、查看全部
-
。。。查看全部
-
返回顶部的主要方法查看全部
-
window.onscroll 滚动条滚动时触发查看全部
-
document.documentElement.scrollTop 滚动条数值，可读写查看全部
-
与锚链接相似，将a的href设置为“#”，就可以直接返回顶部查看全部
-
在执行onclick事件中，已经触发了onscroll 事件。因为浏览器滚动条滚动时就会触发 onscroll 事件，通常情况下指上下滚动条滚动。所以在这里浏览器无法判断是自动执行的滚动条滚动还是用户手动执行的滚动，直到onclick方法中的setInterval执行完毕也不会进入onscroll 方法。改用window.onmousewheel=function(){clearInterval(timer);};方法即可查看全部
-
主要知识点查看全部
-
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en"> <head> <title>Javascript 回到顶部效果</title> <!-- <link rel="stylesheet" type="text/css" href="style.css" /> --> <style type="text/css"> #btn { width:40px; height:40px; //固定定位设置 position:fixed; left:50%; margin-left:610px; bottom:30px; background:url(http://img1.sycdn.imooc.com//535e0dc100010e9c00400080.jpg) no-repeat left top; } #btn:hover { background:url(http://img1.sycdn.imooc.com//535e0dc100010e9c00400080.jpg) no-repeat 0 -39px; } .box { width:1190px; //实现大图居中 magin:0 auto; } </style> </head> <body> <div class="box"> <img src="http://img1.sycdn.imooc.com//535e0ce800015b7511902787.jpg" /> </div> <a href="javascript:;" id="btn" title="回到顶部"></a> </body> </html>查看全部
举报
0/150
提交
取消