跟隨滾動條漂浮的返回頂部按鈕效果
比較優秀的一款超過一屏高度才顯示的,跟隨滾動條漂浮的返回頂部按鈕特效程式碼。
<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test</title>
<style>
body{ height:2000px;}
.rTop{ width:100px; height:25px; text-align:center; font-size:small; line-height:25px; border:1px solid #999; position:fixed; right:0; bottom:0;
border-bottom-color:#333; border-right-color:#333; margin:5px; cursor:pointer; display:none}
</style>
</head>
<body>
<div class="rTop" id="rTop">返回頂部</div>
<script>
window.onscroll=function(){
if(document.body.scrollTop||document.documentElement.scrollTop>0){
document.getElementById('rTop').style.display="block"
}else{
document.getElementById('rTop').style.display="none"
}
}
</script>
</body>
</html>
相關文章
- 按鈕滾動條效果
- vue js 獲取滾動距離 以及 返回頂部按鈕VueJS
- div有滾動條 返回頂部
- js向下滾動一段距離出現返回頂部按鈕JS
- jQuery返回頂部按鈕詳解jQuery
- RecyclerView滑動到底部的時候點選按鈕直接返回頂部View
- 移動端div跟隨滾動條滾動(自制
- 拖動滾動條實現div跟隨效果程式碼例項
- 原生JS控制多個滾動條同步跟隨滾動JS
- unity 實現輪盤方式的按鈕滾動效果Unity
- 回到頂部和回到頂部按鈕的顯示隱藏
- 從頁面底部回到頂部+動畫效果 & 翻頁後從按鈕處回到頁面頂部動畫
- 實現隨著滾動條滾動,導航會自動切換的效果
- CSS_導航欄+固定浮動的回到頂部按鈕CSS
- JavaScript隨機漂浮碰壁效果JavaScript隨機
- 直播軟體搭建,點選按鈕自動回到頂部
- 隨滾動條移動的層
- 隱藏滾動條保留滾動效果
- canvas圓形隨機漂浮效果Canvas隨機
- [前端外掛] js返回頂部 效果實現前端JS
- Dcat-admin新增頂部右側按鈕
- JavaScript左右拖動滑動的按鈕效果JavaScript
- 仿今日頭條按鈕loading效果
- CSS3模擬實現iphone返回按鈕效果CSSS3iPhone
- 點選返回頂部程式碼具有緩衝效果
- js返回頂部JS
- 基於js實現點選按鈕回到頂部JS
- 懸浮按鈕點選回到頂部FloatingActionButton
- 短視訊帶貨原始碼,更改滾動條跟隨手機滑動的速度原始碼
- 拖動滾動條一定距離可以固定於頂部的導航欄
- 左右帶有按鈕圖片水平滾動
- 滾動到頂部踩坑記錄
- 點選返回頂部效果實現程式碼詳解
- 電腦隨身碟啟動按鈕
- 手機直播原始碼,點選按鈕,立即回到頂部原始碼
- JavaScript跟隨滑鼠移動的圖片效果JavaScript
- 直播軟體搭建,vue3 頁面回到頂部(平緩滾動效果)Vue
- js實現的模擬滾動條效果JS