JS实现网站图片飘窗效果,JavaScript悬浮广告(源文件代码)

JS实现网站图片飘窗效果,JavaScript悬浮广告(源文件代码)

JS实现网站图片飘窗效果,JavaScript悬浮广告,提供以下代码,仅供参考:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>郑州网站建设,河南SEO,郑州网站优化</title>
        <style>*{margin:0px;padding:0px}#ad{position:absolute;left:0px;top:0px;}</style>
    </head>
    <body>
        <div id="ad"><img src="http://www.hugekj.com/e/data/images/notimg.gif" />
            <div id="GB"><span onclick="fun()">X</span></div>
        </div>
    </body>
    <script type="text/javascript">
        //通过ID获取imgad=document.getElementById("ad");//定义横纵坐标x=0;y=0;//设置初始速度xv=1.5;yv=1.5;//根据img横纵坐标位置,设置反方向速度function fun(){if(x<0||x>window.innerWidth-ad.offsetWidth){xv=-xv;}if(y<0||y>window.innerHeight-ad.offsetHeight){yv=-yv;}x+=xv;y+=yv;//将xy坐标值赋予img css样式中的left与topad.style.left=x+"px";ad.style.top=y+"px";}//定时器调用mytime=setInterval(fun,100);//ad绑定鼠标悬停事件ad.onmouseover=function(){//清除定时器clearInterval(mytime);}//鼠标离开,重新触发定时器ad.onmouseout=function(){mytime=setInterval(fun,100);}
    </script>
</html>

 

JS实现网站图片飘窗效果,JavaScript悬浮广告(源文件代码)

相关文章:

你感兴趣的文章:

标签云: