-
頂頂頂頂頂頂頂頂頂頂查看全部
-
水水水水水水水水水水查看全部
-
完整源代碼查看全部
-
源代碼查看全部
-
滾動(dòng)條設(shè)置查看全部
-
<!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 滾動(dòng)條滾動(dòng)時(shí)觸發(fā)查看全部
-
document.documentElement.scrollTop 滾動(dòng)條數(shù)值,可讀寫查看全部
-
與錨鏈接相似,將a的href設(shè)置為“#”,就可以直接返回頂部查看全部
-
在執(zhí)行onclick事件中,已經(jīng)觸發(fā)了onscroll 事件。因?yàn)闉g覽器滾動(dòng)條滾動(dòng)時(shí)就會(huì)觸發(fā) onscroll 事件,通常情況下指上下滾動(dòng)條滾動(dòng)。所以在這里瀏覽器無法判斷是自動(dòng)執(zhí)行的滾動(dòng)條滾動(dòng)還是用戶手動(dòng)執(zhí)行的滾動(dòng),直到onclick方法中的setInterval執(zhí)行完畢也不會(huì)進(jìn)入onscroll 方法。改用window.onmousewheel=function(){clearInterval(timer);};方法即可查看全部
-
主要知識(shí)點(diǎn)查看全部
-
<!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; //固定定位設(shè)置 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; //實(shí)現(xiàn)大圖居中 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>查看全部
舉報(bào)
0/150
提交
取消