博客美化,页首的飘雪效果
首先你的申请博客js权限
接着在页首html代码栏添加如下代码,即可
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 | <script> var flackColor = "#fff" ; //雪片颜色 var newOne = 10; //间隔10毫秒 var flake = $( "<div></div>" ). html( "❄" ). css( "position" , "absolute" ); $( function(){ setInterval( function(){ var dWidth = $ ( "#div_1" ). width (); //获取页面宽度 var dHeight = $( "#div_1" ). height(); //获取页面高度 var startLeft = dWidth* Math. random(); //雪片随机出现位置 var endLeft = dWidth* Math. random(); //雪片随机结束位置 var flakeSize= 5+ 50* Math. random(); //雪片大小 var durationTime= 4000+ 7000* Math. random(); var startOpacity= 0.7+ 0.3* Math. random(); //出现时雪片透明度 var endOpacity= 0.4+ 0.3* Math. random(); //消失时图片透明度 flake. clone(). appendTo( $( "body" )). css({ "left" :startLeft, "top" : "-55px" , "opacity" :startOpacity, "font-size" :flakeSize, "color" :flackColor, }). animate({ "left" :endLeft, "top" :dHeight, "opacity" :endOpacity }, durationTime, function(){ $( this ). remove(); }) }, newOne); }) </script> |
<div class="div_1" id="div_1"></div>
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 基于Microsoft.Extensions.AI核心库实现RAG应用
· Linux系列:如何用heaptrack跟踪.NET程序的非托管内存泄露
· TypeScript + Deepseek 打造卜卦网站:技术与玄学的结合
· 阿里巴巴 QwQ-32B真的超越了 DeepSeek R-1吗?
· 【译】Visual Studio 中新的强大生产力特性
· 10年+ .NET Coder 心语 ── 封装的思维:从隐藏、稳定开始理解其本质意义
· 【设计模式】告别冗长if-else语句:使用策略模式优化代码结构