这篇文章介绍了在 JS 中广告漂浮效果的实现代码,有需要的朋友可以参考一下
Javascript 是一种由 Netscape 的 LiveScript 发展而来的原型化继承的基于对象的动态类型的区分大小写的客户端脚本语言,主要目的是为了解决服务器端语言,比如 Perl,遗留的速度问题,为客户提供更流畅的浏览效果。
/*
利用 window 对象,实现浮动效果
1、有一个 div,就是我们要控制的,它的起始点坐标(0,0)
2、设定横向和纵向的速度
3、控制 div 移动
1)div 是否到达边界,设置图片速度反向移动
*/
// 获取图片所在的 div 对象
var img=document.getElementById("floatdiv");
// 设置 div 起始点坐标
var x=0,y=0;
// 设置 div 行进速度
var xSpeed=2,ySpeed=1;
// 设置图片移动
var w=document.body.clientWidth-200,h=document.body.clientHeight-100;
function floatdiv(){
// 比较图片是否到达边界,如查到达边界 改变方向; 如未到达边界
if(x>w||x<0) xSpeed= -xSpeed;
if(y>h||y<0) ySpeed= -ySpeed;
x+=xSpeed;
y+=ySpeed;
// 设置坐标值,起始坐标 + 速度
img.style.top=y+"px";
img.style.left=x+"px";
setTimeout("floatdiv()",10);
}
floatdiv();
来源: