一款漂亮的滾動條

canwu · 發表于 2024-2-23 10:42:13

1 路徑找到 /template/你的模板/common/header.html

在找到這段代碼：
<font color="#708090"><body id="nv_{$_G[basescript]}" class="pg_{CURMODULE}{if $_G['basescript'] === 'portal' && CURMODULE === 'list' && !empty($cat)} {$cat['bodycss']}{/if}" onkeydown="if(event.keyCode==27) return false;">
<div id="append_parent"></div><div id="ajaxwaitid"></div></font>

復制代碼

把下面代碼添加到上<body> 之間 </body>

復制代碼

2 路徑找到 /template/你的模板/common/footer.html

添加到里面 footer.html 里面

復制代碼

3 路徑找到 /template/你的模板/common/common.css

添加到 common.css 最下面

*{
-margin: 0;
-padding: 0;
-box-sizing: border-box;
font-family: "Droid Serif","Times New Roman","PingFang SC","Hiragino Sans GB","Source Han Sans CN","WenQuanYi Micro Hei","Microsoft Yahei",serif;
}
section{
-padding: 50px;
-background: #000;
-min-height: 100vh;
}
section h2{
font-size: 2.5em;
color: #fff;
}
section p{
font-size: 1.2em;
color: #fff;
}
::-webkit-scrollbar{
width: 0;
}
#scrollpath{
position: fixed;
top: 0;
right: 0;
width: 10px;
height: 100%;
background: rgba(255,255,255,0.05);
}
#progressbar{
position: fixed;
top: 0;
right: 0;
width: 10px;
background: linear-gradient(to top,#008aff,#00ffe7);
animation: animate 5s linear infinite;
}
@keyframes animate{
0%,100%{
filter:hue-rotate(0deg);
}
50%{
filter:hue-rotate(360deg);
}
}
#progressbar:before{
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(to top,#008aff,#00ffe7);
filter: blur(10px);
}
#progressbar:after{
content: '';
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: linear-gradient(to top,#008aff,#00ffe7);
filter: blur(30px);
}

復制代碼

演示地址: https://mp3.wf

hipass · 發表于 2024-2-23 10:46:54

效果很炫酷，謝謝分享，不過不適合應用于我的網站

海哥 · 發表于 2024-2-23 13:52:14

很炫，很給力

TaC · 發表于 2024-11-18 14:51:36

提示: 作者被禁止或刪除內容自動屏蔽

風吹故人香 · 發表于 2024-11-18 18:16:33

很漂亮收藏了

風吹故人香 · 發表于 2024-11-18 21:22:38

感覺首頁字體變歪了

久久久久av_欧美日韩一区二区在线_国产精品三区四区_日韩中字在线