单击鼠标显示漂亮特效-JS特效-爱易网页

单击鼠标显示漂亮特效

日期：2014-05-18　浏览次数：20265 次

欢迎光临爱易网网页脚本特效中心，点击运行按钮演示特效：

以下是程序代码

要完成此效果需要三个步骤

第一步：把如下代码加入到<head>区域中

脚本说明:

第一步:把如下代码加入<head>区域中

<!-- Begin

var ver  = navigator.appVersion;

var dom  = document.getElementById ? 1 : 0;

var ie5  = (ver.indexOf("MSIE 5") > -1 && dom) ? 1 : 0;

var n  = (document.layers);

var ie = (document.all);

var sparksAflyin = 0;

var totalSparks = 0;

var sparksOn = 1;

function initMouseEvents() {

document.onmousedown = mouseDown;

if (n) document.captureEvents(Event.MOUSEDOWN | Event.MOUSEMOVE);

}

function mouseDown(e) {

if (sparksOn) {

var mousex = (n) ? e.pageX : event.x+document.body.scrollLeft;

var mousey = (n) ? e.pageY : event.y+document.body.scrollTop;

if (!sparksAflyin) {

for (var k = 0; k <= 9; k++)

eval('SHOW("sDiv'+k+'")');

sparksAflyin = 1;

totalSparks = 0;

for(i = 0;i <= 9; i++)

eval('moveTo('+i+',0,'+mousex+','+mousey+')');

}

function moveTo(i,j, mousex, mousey){

if (j < eval('anim_'+i+'_x.length') ){

var tempx = eval('anim_'+i+'_x[j]+mousex');

var tempy = eval('anim_'+i+'_y[j]+mousey');

if (ie) {

if(tempy+30 > (document.body.offsetHeight+document.body.scrollTop))

tempy = document.body.offsetHeight+document.body.scrollTop-30;

if(tempx+30 > (document.body.offsetWidth+document.body.scrollLeft))

tempx = document.body.offsetWidth+document.body.scrollLeft-30;

eval('document.all.sDiv'+i+'.style.left = tempx;');

eval('document.all.sDiv'+i+'.style.top  = tempy;');

}

if (n) {

eval('document.layers.sDiv'+i+'.left = tempx;');

eval('document.layers.sDiv'+i+'.top  = tempy;');

}

j++;

//  timeout: 50 = fireworks speed, larger number = slower speed

setTimeout("moveTo("+i+","+j+","+mousex+","+mousey+")",50)

}

else {

eval('HIDE("sDiv'+i+'")');

totalSparks++;

}

if (totalSparks == 10) {

sparksAflyin = 0;

totalSparks  = 0;

}

function SHOW(divName){

if (document.all)

eval('document.all.'+divName+'.style.visibility = "visible";');

else if (document.layers)

eval('document.layers["'+divName+'"].visibility = "visible";');

}

function HIDE(divName){

if (document.all)

eval('document.all.'+divName+'.style.visibility = "hidden";');

else if (document.layers)

eval('document.layers["'+divName+'"].visibility = "hide";');

}

anim_0_x=new Array(20,20,10,0,0,0,0,0,0,0,0,0);

anim_0_y=new Array(-20,-40,-60,-80,-60,-40,-20,0,20,40,60,80);

anim_1_x=new Array(20,20,17,36,60,78,90,92,93,98,108,120,133,152,181);

anim_1_y=new Array(-20,-20,-33,-38,-38,-27,-2,25,51,84,113,141,162,212,253);

anim_2_x=new Array(20,20,2,3,4,5,6,7,8,9,10,12,13,15,18);

anim_2_y=new Array(-20,-20,-33,-38,-38,-27,-2,25,51,84,113,141,162,212,253);

anim_3_x=new Array(-20,-20,-2,-1,7,10,18,35,60,102,94,94,93,97,108,111,117,127);

anim_3_y=new Array(-20,-25,-64,-89,-104,-150,-173,-197,-213,-199,-151,-101,-66,-17,27,87,140,189);

anim_4_x=new Array(-20,-20,-10,-39,-30,-69,-64,-138,-154,-200,-181,-209,-191,-207,-203,-213,-202,-221,-211);

anim_4_y=new Array(-20,-20,-28,-51,-79,-100,-135,-154,-193,-183,-149,-134,-89,-60,8,51,107,157,201);

anim_5_x=new Array(-20,-29,-51,-72,-105,-133,-164,-189,-209,-229,-247,-270,-279,-282,-283,-283,-285,-286,-288);

anim_5_y=new Array(-20,-55,-86,-116,-154,-183,-205,-217,-217,-198,-169,-120,-44,-8,40,87,144,190,248);

anim_6_x=new Array(-20,-20,-7,14,44,79,143,186,217,226,234,244,250,259,265,274);

anim_6_y=new Array(-20,-21,-72,-113,-139,-166,-188,-181,-126,-68,-3,54,134,187,215,257);

anim_7_x=new Array(20,20,-3,-9,-13,-27,-33,-44,-54,-66,-77,-95,-107,-136,-150,-160,-164,-168,-171,-172,-172,-176,-175);

anim_7_y=</div></div>

<div class="clearfix"></div>
                    </div>
                    <nav aria-label="...">
                        <ul class="pager">
                            <li class="previous"><a href="4667">上一篇：狡猾的按钮特效</a></li>

<li class="next"><a href="4124">下一篇：文字滚动脚本</a></li>
                        </ul>
                    </nav>

<div class="alert alert-warning" role="alert">
                        <strong>免责声明：</strong> 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
                    </div>

<div class="col-md-6 col-xs-12">
                      <li class="articleAbout"><a href='/ItNews/34291' title='OPPO Find7体验测 Find7综测' target="_blank">
                        OPPO Find7体验测 Find7综测</a></li></div>
                   
                
                  <div class="col-md-6 col-xs-12">
                      <li class="articleAbout"><a href='/ItNews/34359' title='2013年至今中国互联网行业十大并购案汇总' target="_blank">
                        2013年至今中国互联网行业十大并购案汇总</a></li></div>
                   
                
                  <div class="col-md-6 col-xs-12">
                      <li class="articleAbout"><a href='/ItNews/10810' title='网曝富士康500万iphone遭退货是确证的事' target="_blank">
                        网曝富士康500万iphone遭退货是确证的事</a></li></div>
                   
                
                  <div class="col-md-6 col-xs-12">
                      <li class="articleAbout"><a href='/ItNews/10806' title='微软谷歌高层访韩面前：忌惮三星的崛起 ' target="_blank">
                        微软谷歌高层访韩面前：忌惮三星的崛起 </a></li></div>
                   
                
                  <div class="col-md-6 col-xs-12">
                      <li class="articleAbout"><a href='/ItNews/34210' title='FB上广告费用昂贵而且效果不及Twitter' target="_blank">
                        FB上广告费用昂贵而且效果不及Twitter</a></li></div>
                   
                
                  <div class="col-md-6 col-xs-12">
                      <li class="articleAbout"><a href='/ItNews/34454' title='永不磨灭的九大尖端编程语言' target="_blank">
                        永不磨灭的九大尖端编程语言</a></li></div>
                   
                
                  <div class="col-md-6 col-xs-12">
                      <li class="articleAbout"><a href='/ItNews/10812' title='雅安地震 绝不宽恕应用人们爱心的骗子！' target="_blank">
                        雅安地震 绝不宽恕应用人们爱心的骗子！</a></li></div>
                   
                
                  <div class="col-md-6 col-xs-12">
                      <li class="articleAbout"><a href='/ItNews/34446' title='Twitter收购印度手机营销公司ZipDial' target="_blank">
                        Twitter收购印度手机营销公司ZipDial</a></li></div>
                   
                
                  <div class="col-md-6 col-xs-12">
                      <li class="articleAbout"><a href='/ItNews/34353' title='微博启动自媒体计划 粉丝+收入双激励是亮点' target="_blank">
                        微博启动自媒体计划 粉丝+收入双激励是亮点</a></li></div>
                   
                
        </ol>
    </div>
</div>

</div>

</div>
            </div>
            <div class="clearfix"></div>

<footer class=" footer navbar-bottom">
<em>友情链接：</em>
    
      <a href="http://www.aiyiweb.com/" target="_blank">爱易网 </a>            
    
      <a href="http://www.aiyiweb.com/" target="_blank">云虚拟主机技术 </a>            
    
      <a href="http://www.aiyiweb.com/" target="_blank">云服务器技术 </a>            
    
      <a href="http://www.aiyiweb.com/" target="_blank">程序设计技术 </a>            
    
      <a href="http://www.aiyiweb.com/" target="_blank">开发网站 </a>            
    
      <a href="http://www.aiyiweb.com/" target="_blank">APP开发教程 </a>            
    
<br />
<script type="text/javascript">(function(){document.write(unescape('%3Cdiv id="bdcs"%3E%3C/div%3E'));var bdcs = document.createElement('script');bdcs.type = 'text/javascript';bdcs.async = true;bdcs.src = 'http://znsv.baidu.com/customer_search/api/js?sid=15239353030108964139' + '&plate_url=' + encodeURIComponent(window.location.href) + '&t=' + Math.ceil(new Date()/3600000);var s = document.getElementsByTagName('script')[0];s.parentNode.insertBefore(bdcs, s);})();</script>

Copyright © 2013-2026 爱易网页 当前在线：400人　
        网站在14时26分3秒内访问总人数：142551人
    当前 6.66%
　<a href="https://beian.miit.gov.cn" target="_blank">粤ICP备18100884号-2 </a>
<script charset="UTF-8" id="LA_COLLECT" src="//sdk.51.la/js-sdk-pro.min.js"></script>
<script>LA.init({ id: "JszEmKrtpbU59dY5", ck: "JszEmKrtpbU59dY5" })</script>

</footer>

</div>
   
</body>
</html>