博客美化,页首的飘雪效果
首先你的申请博客js权限
接着在页首html代码栏添加如下代码,即可
<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>