JavaScript实现图片上下飘动可配置浮动速率

发布时间：2018-08-14 01:52:18 所属栏目：编程来源：站长网

导读：Java Script实现的图片上下飘动结果，有点相同于网页飘浮告白，可是与之差异的是，此图片只能上下移动，在下边呈现逐步向上浮动，到顶部后自动向下移动，在代码中可配置图片的浮动速率，但愿对您有所辅佐。演示： htmlheadmeta http-equiv=Content-Type c

　　JavaScript实现的图片上下飘动结果，有点相同于网页飘浮告白，可是与之差异的是，此图片只能上下移动，在下边呈现逐步向上浮动，到顶部后自动向下移动，在代码中可配置图片的浮动速率，但愿对您有所辅佐。

　　演示：

<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>JavaScript实现图片上下飘动可配置浮动速率</title> </head> <body> <div id="point1" STYLE="position:absolute;visibility:visible;"> <table border="0" cellspacing="0" cellpadding="0"> <tr><td><a href="http://www.veryhuo.com"><img src="http://www.veryhuo.com/images/logo.gif" alt="" border="0"></a> </td></tr><tr><td><center><a href="http://www.veryhuo.com"> <font face="Arial" size="2" color="#0000FF">收集编程站</font> </a></center></td></tr></table> </div> <script LANGUAGE="JavaScript"> var XX=20; // X position of the scrolling objects var xstep=1; var delay_time=30; // 配置飘动的速率，数字越大则越慢。 //Begin of the unchangable area, please do not modify this area var YY=0; var ch=0; var oh=0; var yon=0; var ns4=document.layers?1:0 var ie=document.all?1:0 var ns6=document.getElementById&&!document.all?1:0 if(ie){ YY=document.body.clientHeight; point1.style.top=YY; } else if (ns4){ YY=window.innerHeight; document.point1.pageY=YY; document.point1.visibility="hidden"; } else if (ns6){ YY=window.innerHeight document.getElementById('point1').style.top=YY } function reloc1() { if(yon==0){YY=YY-xstep;} else{YY=YY+xstep;} if (ie){ ch=document.body.clientHeight; oh=point1.offsetHeight; } else if (ns4){ ch=window.innerHeight; oh=document.point1.clip.height; } else if (ns6){ ch=window.innerHeight oh=document.getElementById("point1").offsetHeight } if(YY<0){yon=1;YY=0;} if(YY>=(ch-oh)){yon=0;YY=(ch-oh);} if(ie){ point1.style.left=XX; point1.style.top=YY+document.body.scrollTop; } else if (ns4){ document.point1.pageX=XX; document.point1.pageY=YY+window.pageYOffset; } else if (ns6){ document.getElementById("point1").style.left=XX document.getElementById("point1").style.top=YY+window.pageYOffset } } function onad() { if(ns4) document.point1.visibility="visible"; loopfunc(); } function loopfunc() { reloc1(); setTimeout('loopfunc()',delay_time); } if (ie||ns4||ns6) window.onload=onad </script> </body> </html><div style="text-align:center;margin:30px 0 0 0;"><hr style="color:#999;height:1px;">如不能表现结果，请按Ctrl+F5革新本页，更多网页代码：<a href='http://www.veryhuo.com/' target='_blank'>http://www.veryhuo.com/</a></div>
提醒：可修改儿女码再运行!　

（编辑：湖南网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!

MySQL源码安置	运用图形界面从SQL导入
MySQL5.7+keepalived+	windows系统下jsp+mys

JavaScript实现图片上下飘动 可配置浮动速率

JavaScript实现图片上下飘动可配置浮动速率