网页下角的top按钮，怎么做的？_服务器知识

页面滚动始终在右下角是使用javascript进行控制的，点击回到页面顶端是使用的锚记，也就是在页面顶部设置了一个标记<a name="top"，然后当点击那按钮的时候使用<a href="#top"TOP</a的方式寻找名叫top的标记就可以实现。

那我给你一个比较帅的，保证你满意。。。<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" " http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

<title>自创随滚动条移动的层</title>

.div{width:200pxheight:100pxborder:5px solid #993300line-height:90pxtext-align:centerbackground:#CCCCCCposition:absolutez-index:1000}

</style>

function s1(){

var d1=document.getElementById("d1")

d1.style.top=document.documentElement.scrollTop+"px"

d1.style.left=document.documentElement.scrollLeft+"px"

}

function s2(){

var d2=document.getElementById("d2")

d2.style.top=document.documentElement.scrollTop+"px"

d2.style.left=parseInt(document.documentElement.clientWidth+document.documentElement.scrollLeft-d2.offsetWidth)+"px"

//d2.style.left="400px"

}

function s3(){

var d3=document.getElementById("d3")

d3.style.top=parseInt(document.documentElement.clientHeight+document.documentElement.scrollTop-d3.offsetHeight)+"px"

//d3.style.top=document.documentElement.scrollHeight+"px"

d3.style.left=parseInt(document.documentElement.scrollLeft)+"px"

}

function s4(){

var d4=document.getElementById("d4")

d4.style.top=parseInt(document.documentElement.clientHeight+document.documentElement.scrollTop-d4.offsetHeight)+"px"

d4.style.left=parseInt(document.documentElement.clientWidth+document.documentElement.scrollLeft-d4.offsetWidth)+"px"

}

function s5(){

var d5=document.getElementById("d5")

d5.style.top=parseInt(document.documentElement.clientHeight/2+document.documentElement.scrollTop-d5.offsetHeight/2)+"px"

d5.style.left=parseInt(document.documentElement.clientWidth/2+document.documentElement.scrollLeft-d5.offsetWidth/2)+"px"

}

function s(){

s1()s2()s3()s4()s5()

}

window.onscroll=s

window.onresize=s

window.onload=s

</script>

</head><body>

</div>

</body>

</html>

欢迎分享，转载请注明来源：夏雨云

原文地址:https://www.xiayuyun.com/zonghe/388934.html

网页下角的top按钮，怎么做的？

发表评论

评论列表（0条）