-
使用JS實(shí)現(xiàn)效果查看全部
-
使用錨鏈接實(shí)現(xiàn)效果的優(yōu)缺點(diǎn)查看全部
-
錨鏈接實(shí)現(xiàn)定位導(dǎo)航效果查看全部
-
讓頁(yè)面回到頂部的js腳本查看全部
-
頁(yè)面回到頂部的js腳本查看全部
-
top js查看全部
-
isTop的邏輯問(wèn)題: 首先你點(diǎn)擊回到頂部時(shí),滾動(dòng)條開始往回滾,這時(shí)候istop為true,因?yàn)闈L動(dòng)條滾動(dòng)觸發(fā)window.onscroll 事件,!istop為false不執(zhí)行clearInterval(timer);但是下面的isTop=false;再將isTop置為false。這時(shí)候你人為滾動(dòng)鼠標(biāo),則再次觸發(fā)window.onscroll 事件,此時(shí)!istop為true 執(zhí)行clearInterval(timer);則滾動(dòng)條停下來(lái)查看全部
-
為什么改成負(fù)的就能滾到頭? 回答這個(gè)問(wèn)題前,先來(lái)看下為什么不改成負(fù)數(shù)就不行呢? 注意這句:var ispeed = Math.floor(osTop / 6); 當(dāng)上面osTop的值小于6這個(gè)除數(shù)時(shí),ispeed的值始終等于0(向下取整了),所以問(wèn)題來(lái)了,當(dāng)ispeed的值不變時(shí),osTop - ispeed 這個(gè)控制滾動(dòng)條的值也就不變了,所以滾動(dòng)條永遠(yuǎn)到不了頂。 實(shí)際中,當(dāng)osTop = 5 時(shí),ispeed 為 0,下面兩句也始終為5: document.documentElement.scrollTop = osTop - ispeed; // 兼容IE document.body.scrollTop = osTop - ispeed; // 兼容FF、Chrome 所以滾動(dòng)條一直停在距離頂部5px的地方。 OK,那為什么改成負(fù)數(shù)就行了呢?其實(shí)改負(fù)數(shù)的目的就是讓ispeed的值不為0. 實(shí)際中,當(dāng)osTop = 5(或小于5時(shí)),Math.floor(osTop / 6) 的值為 -1,這樣就使得 osTop + ispeed 的值始終能減小下去,直至到0. 這種用負(fù)數(shù)的方法不好理解,我是采用Math.ceil()這個(gè)方法(向上取整)實(shí)現(xiàn)的,代碼如下: obtn.onclick = function(){ // 定時(shí)器開啟 timer = setInterval(function(){ // 獲取當(dāng)前滾動(dòng)條距離頂部距離 var osTop = document.documentElement.scrollTop || document.body.scrollTop; var ispeed = Math.ceil(osTop / 6); document.documentElement.scrollTop = osTop - ispeed; document.body.scrollTop = osTop - ispeed; if(osTop == 0){ clearInterval(timer); } },30); }查看全部
-
主要知識(shí)點(diǎn)查看全部
-
@回到頂部效果——2-1 案例實(shí)現(xiàn)中相關(guān)知識(shí)點(diǎn)講解 置頂操作 DOM操作: 1.document.getElementById();根據(jù)ID獲取標(biāo)簽元素 2.document.documentElement.scrollTop();滾動(dòng)條的數(shù)值,可讀寫 事件運(yùn)用: 1.window.onload 頁(yè)面加載完畢后觸發(fā) 2.onclick 點(diǎn)擊后觸發(fā) 3.window.onscroll 滾動(dòng)條滾動(dòng)時(shí)觸發(fā) 定時(shí)器 1.setInterval() 設(shè)置定時(shí)器,需傳2個(gè)參數(shù) 2.clearInteval() 關(guān)閉定時(shí)器,需傳1個(gè)參數(shù)查看全部
-
bbb查看全部
-
top查看全部
-
1.document.getElementById 2.window.onload//網(wǎng)頁(yè)加載完成 3.window.onscroll 滾動(dòng)條滾動(dòng)時(shí) 4.t=setInterval(fun,time) clearInterval(t) 5.scrolltop=document.documentElement.scrollTop || document.body.scrollTop 6.viewHight=document.documentElement.clientHeight||document.body.clientHeight查看全部
-
//本課程script.js源碼 window.onload = function(){ var obtn = document.getElementById('btn'); //獲取頁(yè)面可視區(qū)的高度 var clientHeight=document.documentElement.clientHeight; var timer = null; var isTop = true; window.onscroll = function(){ // alert(clientHeight); var osTop = document.documentElement.scrollTop || document.body.scrollTop ; if (osTop >= clientHeight){ //顯示按鈕 obtn.style.display="block"; }else { //隱藏按鈕 obtn.style.display="none"; } if (!isTop){ clearInterval(timer); } isTop = false; } obtn.onclick = function(){ //設(shè)置定時(shí)器 timer = setInterval(function(){ //獲取滾動(dòng)條距離頂部的高度 var osTop = document.documentElement.scrollTop || document.body.scrollTop ; var ispeed = Math.floor(-osTop / 6); document.documentElement.scrollTop = document.body.scrollTop = osTop +ispeed; isTop = true; console.log(osTop -ispeed); if (osTop == 0){ clearInterval(timer); } },30); } }查看全部
-
我剛試了,MyEclipse新建了一個(gè)Web Project 如果在首頁(yè)上index.jsp這樣用,可以回到頂部,其他頁(yè)面就不行了,為什么?查看全部
舉報(bào)
0/150
提交
取消