当前位置:唯爱资源网 > WordPress > 正文
唯爱网络

作者:唯爱网络

全网最全的网络资源分享网站

手机扫码查看

标签:

本站新添加的烟花代码特效教程

本站新添加的烟花代码特效教程 首先预祝大家新年快乐,身体健康,万事如意!
马上就要过年了,想给网站添加一点年味,特意在百度上搜了一个,分享给大家

教程开始

必须文件jQuery 核心库
没有的自行添加
下面就直接添加本站这里的代码即可

    <link rel="stylesheet" href="http://www.vizyw.com/wp-content/themes/xinnian/jquery-ui.css" />
    <script src="http://www.vizyw.com/wp-content/themes/xinnian/firemaks.js" type="text/javascript"></script>

    <script type="text/javascript">
var cx = 0,cy = 0;
	
var color1 = new Array( new Array({r:241,g:0,b:0},  {r:255,g:72,b:72},  {r:239,g:107,b:107},  {r:255,g:191,b:191},  {r:255,g:255,b:255}),
new Array({r:12,g:152,b:228},  {r:81,g:188,b:246},  {r:100,g:195,b:247},  {r:195,g:232,b:252},  {r:255,g:255,b:255}),
new Array({r:202,g:228,b:12},  {r:226,g:246,b:81},  {r:229,g:247,b:100},  {r:245,g:252,b:195},  {r:255,g:255,b:255}) );
var color2 = new Array( new Array({r:255,g:0,b:0}, {r:228,g:225,b:0}, {r:169,g:0,b:231}, {r:255,g:0,b:148}, {r:255,g:255,b:255}),
new Array({r:0,g:153,b:231}, {r:194,g:0,b:231}, {r:255,g:118,b:0}, {r:141,g:227,b:0}, {r:255,g:255,b:255}), 
new Array({r:255,g:251,b:125}, {r:0,g:206,b:223}, {r:247,g:154,b:255}, {r:255,g:165,b:106}, {r:255,g:255,b:255}) );
var color3 = new Array( new Array({r:0,g:94,b:226}, {r:255,g:255,b:255}),
new Array({r:231,g:234,b:0}, {r:255,g:255,b:255}), 
new Array({r:255,g:109,b:0}, {r:255,g:255,b:255}) );
var color4 = new Array(
	new Array({r:255,g:0,b:0}),
	new Array({r:0,g:94,b:226}),
	new Array({r:214,g:214,b:214}),
	new Array({r:0,g:168,b:0}),
	new Array({r:231,g:234,b:0}),
	new Array({r:255,g:118,b:0}),
	new Array({r:0,g:205,b:255}),
	new Array({r:182,g:255,b:125}),
	new Array({r:255,g:0,b:123})	
	);
	

jQuery(document).ready(function(){
    //	
    $('body').firemaks({
		color: 'random',
		type: 'random',
		color_child: 'inherit',
		type_child: 'random',
		boom_count: 3
		});
	
	$(document).mousemove(function(e){ cx = e.pageX; cy = e.pageY; });	
	$('body').on('click',function(){ $('body').firemaks('fire',cx,cy,40,color1/*'full_random'*/,2,1.5); });
	
	
	//	
	$('#typeset').buttonset();
	$('#typeset input').on('click', function(){ settype ($(this).val(), $(':radio[name=typeset_child]').filter(':checked').val()); });
	$('#typeset_child').buttonset();
	$('#typeset_child input').on('click', function(){ settype ($(':radio[name=typeset]').filter(':checked').val(), $(this).val()); });
	
	function settype(val, val2) {
        var vl1 = null, vl2 = null;
		switch (val){
            case '0': vl1 = 'random'; break;
            case '1': vl1 = 1; break;
            case '2': vl1 = 2; break;
            case '3': vl1 = 3; break;
            default: vl1 = 'random'; break;
			}		
		switch (val2){
            case '0': vl2 = 'random'; break;
            case '1': vl2 = 1; break;
            case '2': vl2 = 2; break;
            case '3': vl2 = 3; break;
			case '4': vl2 = 'inherit'; break;
            default: vl2 = 'random'; break;
			}
		$('body').firemaks('settypes', vl1, vl2);			
        }
		

});
    </script>

未经允许不得转载:

作者:唯爱网络, 转载或复制请以 超链接形式 并注明出处 唯爱资源网
原文地址:《本站新添加的烟花代码特效教程》 发布于2018-02-12

分享到:
赞(0) 打赏

评论 抢沙发

7 + 6 =


觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏

本站新添加的烟花代码特效教程

长按图片转发给朋友

Vieu3.6主题

专业打造轻量级个人企业风格博客主题!
一套模板,四种风格,专注于前端开发,全站响应式布局自适应模板。
官方统一售价¥69

了解一下

登录

忘记密码 ?

您也可以使用第三方帐号快捷登录

Q Q 登 录
微 博 登 录