一款漂亮的 滚动条
<img title="QQ截图20240223101315.png" id="aimg_28285" aid="28285" src1="static/image/common/none.gif" zoom="https://www.dismall.com/data/attachment/forum/202402/23/101341pnj547221g42g2pm.png" src="https://www.dismall.com/data/attachment/forum/202402/23/101341pnj547221g42g2pm.png" class="zoom" onclick="zoom(this, this.src, 0, 0, 0)" width="98" inpost="1" onmouseover="showMenu({'ctrlid':this.id,'pos':'12'})" /><br /> <u><font color="#ff0000"> 1 路径 </font></u> 找到 /template/你的模板/common/header.html <br /><ol><li>在找到这段代码 :<br /><li><font color="#708090"><body id="nv_{$_G}" class="pg_{CURMODULE}{if $_G['basescript'] === 'portal' && CURMODULE === 'list' && !empty($cat)} {$cat['bodycss']}{/if}" onkeydown="if(event.keyCode==27) return false;"><br /><li> <div id="append_parent"></div><div id="ajaxwaitid"></div></font></ol>把下面代码 添加到上<font color="#708090"><font style="background-color:rgb(247, 247, 247)"><body</font></font><font color="#708090"><font style="background-color:rgb(247, 247, 247)">> 之间 </font></font><font color="#708090"><font style="background-color:rgb(247, 247, 247)"></body</font></font><font color="#708090"><font style="background-color:rgb(247, 247, 247)">></font></font><br /><ol><li><div id="progressbar"></div><br /><li><div id="scrollpath"></div></ol><u><font color="#ff0000">2 路径</font></u> 找到 /template/你的模板/common/footer.html <br />添加到里面 footer.html 里面<br /><ol><li><script type="text/javascript"><br /><li> let progress=document.getElementById('progressbar');<br /><li> let totalheight=document.body.scrollHeight - window.innerHeight;<br /><li> window.onscroll=function(){<br /><li> let progressHeight=(window.pageYOffset / totalheight) *100;<br /><li> progress.style.height=progressHeight + "%";<br /><li> }<br /><li></script></ol><u><font color="#ff0000">3 路径 </font></u> 找到 /template/你的模板/common/common.css <br /> 添加到 common.css 最下面<br /><ol><li>*{<br /><li> -margin: 0;<br /><li> -padding: 0;<br /><li> -box-sizing: border-box;<br /><li> font-family: "Droid Serif","Times New Roman","PingFang SC","Hiragino Sans GB","Source Han Sans CN","WenQuanYi Micro Hei","Microsoft Yahei",serif;<br /><li>}<br /><li>section{<br /><li> -padding: 50px;<br /><li> -background: #000;<br /><li> -min-height: 100vh;<br /><li>}<br /><li>section h2{<br /><li> font-size: 2.5em;<br /><li> color: #fff;<br /><li>}<br /><li>section p{<br /><li> font-size: 1.2em;<br /><li> color: #fff;<br /><li>}<br /><li>::-webkit-scrollbar{<br /><li> width: 0;<br /><li>}<br /><li>#scrollpath{<br /><li> position: fixed;<br /><li> top: 0;<br /><li> right: 0;<br /><li> width: 10px;<br /><li> height: 100%;<br /><li> background: rgba(255,255,255,0.05);<br /><li>}<br /><li>#progressbar{<br /><li> position: fixed;<br /><li> top: 0;<br /><li> right: 0;<br /><li> width: 10px;<br /><li> background: linear-gradient(to top,#008aff,#00ffe7);<br /><li> animation: animate 5s linear infinite;<br /><li>}<br /><li>@keyframes animate{<br /><li> 0%,100%{<br /><li> filter:hue-rotate(0deg);<br /><li> }<br /><li> 50%{<br /><li> filter:hue-rotate(360deg);<br /><li> }<br /><li>}<br /><li>#progressbar:before{<br /><li> content: '';<br /><li> position: absolute;<br /><li> top: 0;<br /><li> left: 0;<br /><li> width: 100%;<br /><li> height: 100%;<br /><li> background: linear-gradient(to top,#008aff,#00ffe7);<br /><li> filter: blur(10px);<br /><li>}<br /><li><br /><li>#progressbar:after{<br /><li> content: '';<br /><li> position: absolute;<br /><li> top: 0;<br /><li> left: 0;<br /><li> width: 100%;<br /><li> height: 100%;<br /><li> background: linear-gradient(to top,#008aff,#00ffe7);<br /><li> filter: blur(30px);<br /><li>}</ol><br /><br />演示地址: https://mp3.wf<br /><br /><br /><br /><br /><br />路径<em>, </em>找到 效果很炫酷,谢谢分享,不过不适合应用于我的网站 很炫,很给力 你网站鼠标声音怎么弄的,分享下 很漂亮收藏了 感觉首页字体变歪了
頁:
[1]