java加一个音乐特效代码_博客园添加背景音乐,背景效果!

博客园添加背景音乐,背景效果

申请博客园JS权限

申请话术 实例

尊敬的博客园管理员:

请求申请开通js权限,希望能够把自己的博客修饰的漂亮点,点缀自定义js插件效果,希望管理员可以批准,谢谢!

开通以后就可以使用js代码进行装饰了

流程图

27dddfeeaeeda64cbee612167f22ccb7.png

a36a06635678a0b05514530701cd2dde.png

添加网易云背景音乐

单曲添加

打开网易云登录账户,搜索自己喜欢的歌曲

5b7bba60c6f01aabb11703efb3e003f3.png

75936c58751f8e7386de0ce91cef08a8.png

复制代码到博客园

3704100ebfa119348b054133a60a19e3.png

d88b277a1d55430b1f3f73e170c74e3c.png

看看效果

147746f6a74e6d0cf8b181de29ce6e59.png

添加歌单为背景音乐

创建歌单

74a9ee50ebb19d26db60ed7568c450de.png

把喜欢的音乐添加到歌单

6e02833ea5a78f26afd1f8b6f7392976.png

0e641a3247366ff9ae2aa46450f87b9a.png

拷贝代码到博客园

4233a26eaf04c144a9ca6d35c346b203.png

0e009613f598965ec38c8c056ffd1f46.png

1ef76b0f593fbf4e480f064967d8e97d.png

e4b7dc976c2c4ee2d450138d9f1ae4d3.png

022aeb808f1e5aac52ef6b154e8fe5ac.png

c87705b4e154d210c011360ced28e274.png

点击鼠标点击样式

7fa8b6c7bf50e9f15cb9fe43d7cd6c88.png

鼠标点击效果代码 (❤喜欢就关注一下吧❤ 里边的文字可以根据自己需要进行修改)

var a_idx = 0;

jQuery(document).ready(function($) {

$("body").click(function(e) {

var a = new Array("❤喜欢就关注一下吧❤","❤不是点这里哦❤","❤快去点赞❤","❤在文章最下面哦❤","❤快去推荐一下吧❤","❤感谢观看❤","❤");

var $i = $("").text(a[a_idx]);

a_idx = (a_idx + 1) % a.length;

var x = e.pageX,

y = e.pageY;

$i.css({

"z-index": 999999999999999999999999999999999999999999999999999999999999999999999,

"top": y - 20,

"left": x,

"position": "absolute",

"font-weight": "bold",

"color": "rgb("+~~(255*Math.random())+","+~~(255*Math.random())+","+~~(255*Math.random())+")"

});

$("body").append($i);

$i.animate({

"top": y - 180,

"opacity": 0

},

1500,

function() {

$i.remove();

});

});

});

其他点击效果

f5df1c5df3eae27ef11bf6d6f75d7e03.png

47883b1815c692856a23a37ee257fb6e.png

其他效果自取地址 自取地址

二次元看板娘

效果

e2691ced20b455389e271de7b6226f3c.png

bdb2a610b355eaa4a9f944180d900d0a.png

a8ecb09d2bc900f54671780944475bef.png

雪花效果

效果

b0072aa00323a65238fcec143085236a.png

代码 调整后添加到博客园装饰的页面即可

window.onload = function () {

var minSize = 15; //最小字体

var maxSize = 30;//最大字体

var newOne = 600; //生成雪花间隔

var flakColor = "#1bd3ff"; //雪花颜色

var flak = $("

var dhight = $(window).height(); //定义视图高度

var dw =$(window).width()-80; //定义视图宽度

setInterval(function(){

var sizeflak = minSize+Math.random()*maxSize; //产生大小不等的雪花

var startLeft = Math.random()*dw; //雪花生成是随机的left值

var startOpacity = 0.7+Math.random()*0.3; //随机透明度

var endTop= dhight-100; //雪花停止top的位置

var endLeft= Math.random()*dw; //雪花停止的left位置

var durationfull = 5000+Math.random()*3000; //雪花飘落速度不同

flak.clone().appendTo($("body")).css({

"left":startLeft ,

"opacity":startOpacity,

"font-size":sizeflak,

"color":flakColor

}).animate({

"top":endTop,

"left":endLeft,

"apacity":0.1

},durationfull,function(){

$(this).remove()

});

},newOne);

}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值