码迷,mamicode.com
首页 > Web开发 > 详细

JS打造的弹性跳跃的图片效果且感应鼠标放大

时间:2015-03-04 12:51:25      阅读:170      评论:0      收藏:0      [点我收藏+]

标签:

<html>
    <title>JS打造的弹性跳跃的图片效果且感应鼠标放大丨行车记录仪官网|大疆官网</title>
    <body>
    <script>
    var brOK=false;
    var mie=false;
    var aver=parseInt(navigator.appVersion.substring(0,1));
    var aname=navigator.appName;
    var mystop=0;
    var step=0.2;
    function checkbrOK()
    {if(aname.indexOf("Internet Explorer")!=-1)
    {if(aver>=4) brOK=navigator.javaEnabled();
    mie=true;
    }
    if(aname.indexOf("Netscape")!=-1)
    {if(aver>=4) brOK=navigator.javaEnabled();}
    }
    var vmin=1.5;
    var vmax=3;
    var vr=2;
    var timer1;
    function Chip(chipname,width,height)
    {this.named=chipname;
    this.vx=vmin+vmin;
    this.vy=0;
    this.w=width;
    this.h=height;
    this.xx=0;
    this.yy=0;
    this.timer1=null;
    }
    function movechip(chipname)
    {
    if(brOK && mystop==0)
    {eval("chip="+chipname);
    if(!mie)
    {pageX=window.pageXOffset;
    pageW=window.innerWidth;
    pageY=window.pageYOffset;
    pageH=window.innerHeight;
    }
    else
    {
    pageX=window.document.body.scrollLeft;
    pageW=window.document.body.offsetWidth-8;
    pageY=window.document.body.scrollTop;
    pageH=window.document.body.offsetHeight+15;
    }
    chip.xx=chip.xx+chip.vx;
    chip.vy=chip.vy+step;
    chip.yy=chip.yy+chip.vy;
    if(chip.xx<=pageX)
    {chip.xx=pageX;
    chip.vx=vmin;
    }
    if(chip.xx>=pageX+pageW-85)
    {
    chip.xx=pageX;
    chip.vx=vmin;
    chip.yy=pageY;
    chip.vy=vmin+vmax;
    }
    if(chip.yy>(pageY+pageH-chip.h))
    {
    chip.yy=pageY+pageH-chip.h;
    chip.vy=-chip.vy*0.65;
    }
    if(!mie)
    {eval(document.+chip.named+.top =+chip.yy);
    eval(document.+chip.named+.left=+chip.xx);
    }
    else
    {eval(document.all.+chip.named+.style.pixelLeft=+chip.xx);
    eval(document.all.+chip.named+.style.pixelTop =+chip.yy);
    }
    chip.timer1=setTimeout("movechip(‘"+chip.named+"‘)",20);
    }
    }
    function stopme(flag)
    {
    brOk=true;
    mystop=flag;
    movechip("tome");
    }
    var tome;
    var chip;
    function tome()
    {checkbrOK();
    tome=new Chip("tome",80,80);
    if(brOK && mystop==0)
    {
    movechip("tome");
    }
    }
    ns4=(document.layers)?true:false;
    ie4=(document.all)?true:false;
    function cncover()
    {
    if(ns4){
    document.cnc.left=window.innerWidth/2-400;
    eval(document.cnc.top=document.+chip.named+.top);
    document.cnc.visibility="show";
    stopme(1);
    mytime=setTimeout("cncout()",3000);
    }else if(ie4)
    {
    document.all.cnc.style.left=window.document.body.offsetWidth/2-400;
    document.all.cnc.style.top=parseInt(document.all.tome.style.top);
    document.all.cnc.style.visibility="visible";
    stopme(1);
    mytime=setTimeout("cncout()",3000);
    }
    }
    function cncout()
    {
    clearTimeout(mytime);
    if(ns4){
    document.cnc.visibility="hide";
    stopme(0);
    }else if(ie4)
    {
    document.all.cnc.style.visibility="hidden";
    stopme(0);
    }
    }onload=tome;
    </script>
    <div id="tome" style="position:absolute;"><a href=# onMouseOver=cncover() onMouseOut=cncout() target="_blank"><img src="/images/skinslogo.gif"  border=0></a></div>
    <div id="cnc" style="position:absolute; left:0;top:0;;visibility:hidden;"><a href="/" onMouseOver=cncover() onMouseOut=cncout() target=_blank><img border=0 src="/images/skinslogo.gif" tppabs="/images/skinslogo.gif" width=320 ></a></div>
    </body>
    </html>
    <br><br><hr>
    

 

JS打造的弹性跳跃的图片效果且感应鼠标放大

标签:

原文地址:http://www.cnblogs.com/youtianxia/p/4312933.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!