原文:漂浮广告代码兼容ie、firefox，多个漂浮不冲突，调用只需两行代码

将广告内容放在div中，设置一个id，然后用下面方法调用
var adcls=new
AdMove("div的id");
adcls.Run();
注意，在调用前要先引用Main.js和AdFloat.js,div也要在调用前写好，原因就不用说了吧

或者也可以用下面方法，在页面加载完成时调用，就不用考虑位置了addEvent(window,"load",initad);
function
initad(){
var adcls=new
AdMove("div的id");
adcls.Run();
}

还有两个方法一般情况下没什么用，有兴趣的可以试试，功能是设置漂浮的起始坐标和方向的，如果省掉的话是随机位置随机方向
adcls.SetLocation(x,y)
adcls.SetDirection(dirx,diry)

漂浮广告的斜率是每次碰壁后随机改变的，这样就决不可能出现多个广告，起始位置和方向一致导致其中一个总是被挡住，虽然几率很小

下面是演示

<!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><title>wahaha</title>
<meta
http-equiv="Content-Type" content="text/html;charset=gb2312" />
<script
type="text/javascript">
<!--
//公共脚本文件 main.js
function
addEvent(obj,evtType,func,cap){
cap=cap||false;
if(obj.addEventListener){
obj.addEventListener(evtType,func,cap);
return
true;
}else if(obj.attachEvent){
if(cap){
obj.setCapture();
return
true;
}else{
return obj.attachEvent("on" +
evtType,func);
}
}else{
return false;
}
}
function
getPageScroll(){
var xScroll,yScroll;
if (self.pageXOffset) {
xScroll =
self.pageXOffset;
} else if (document.documentElement &&
document.documentElement.scrollLeft){
xScroll =
document.documentElement.scrollLeft;
} else if (document.body) {
xScroll =
document.body.scrollLeft;
}
if (self.pageYOffset) {
yScroll =
self.pageYOffset;
} else if (document.documentElement &&
document.documentElement.scrollTop){
yScroll =
document.documentElement.scrollTop;
} else if (document.body) {
yScroll =
document.body.scrollTop;
}
arrayPageScroll = new
Array(xScroll,yScroll);
return arrayPageScroll;
}
function
GetPageSize(){
var xScroll, yScroll;
if (window.innerHeight &&
window.scrollMaxY) {
xScroll = document.body.scrollWidth;
yScroll =
window.innerHeight + window.scrollMaxY;
} else if (document.body.scrollHeight
> document.body.offsetHeight){
xScroll =
document.body.scrollWidth;
yScroll = document.body.scrollHeight;
} else
{
xScroll = document.body.offsetWidth;
yScroll =
document.body.offsetHeight;
}
var windowWidth, windowHeight;
if
(self.innerHeight) {
windowWidth = self.innerWidth;
windowHeight =
self.innerHeight;
} else if (document.documentElement &&
document.documentElement.clientHeight) {
windowWidth =
document.documentElement.clientWidth;
windowHeight =
document.documentElement.clientHeight;
} else if (document.body)
{
windowWidth = document.body.clientWidth;
windowHeight =
document.body.clientHeight;
}
if(yScroll <
windowHeight){
pageHeight = windowHeight;
} else {
pageHeight =
yScroll;
}
if(xScroll < windowWidth){
pageWidth = windowWidth;
}
else {
pageWidth = xScroll;
}
arrayPageSize = new
Array(pageWidth,pageHeight,windowWidth,windowHeight)
return
arrayPageSize;
}
//广告脚本文件 AdMove.js
/*
例子
<div
id="Div2">
***** content ******
</div>
var ad=new
AdMove("Div2");
ad.Run();
*/
////////////////////////////////////////////////////////
var
AdMoveConfig=new
Object();
AdMoveConfig.IsInitialized=false;
AdMoveConfig.ScrollX=0;
AdMoveConfig.ScrollY=0;
AdMoveConfig.MoveWidth=0;
AdMoveConfig.MoveHeight=0;
AdMoveConfig.Resize=function(){
var
winsize=GetPageSize();
AdMoveConfig.MoveWidth=winsize[2];
AdMoveConfig.MoveHeight=winsize[3];
AdMoveConfig.Scroll();
}
AdMoveConfig.Scroll=function(){
var
winscroll=getPageScroll();
AdMoveConfig.ScrollX=winscroll[0];
AdMoveConfig.ScrollY=winscroll[1];
}
addEvent(window,"resize",AdMoveConfig.Resize);
addEvent(window,"scroll",AdMoveConfig.Scroll);
function
AdMove(id){
if(!AdMoveConfig.IsInitialized){
AdMoveConfig.Resize();
AdMoveConfig.IsInitialized=true;
}
var
obj=document.getElementById(id);
obj.style.position="absolute";
var
W=AdMoveConfig.MoveWidth-obj.offsetWidth;
var
H=AdMoveConfig.MoveHeight-obj.offsetHeight;
var x = W*Math.random(),y =
H*Math.random();
var rad=(Math.random()+1)*Math.PI/6;
var
kx=Math.sin(rad),ky=Math.cos(rad);
var dirx = (Math.random()<0.5?1:-1),
diry = (Math.random()<0.5?1:-1);
var step = 1;
var
interval;
this.SetLocation=function(vx,vy){x=vx;y=vy;}
this.SetDirection=function(vx,vy){dirx=vx;diry=vy;}
obj.CustomMethod=function(){
obj.style.left
= (x + AdMoveConfig.ScrollX) + "px";
obj.style.top = (y +
AdMoveConfig.ScrollY) +
"px";
rad=(Math.random()+1)*Math.PI/6;
W=AdMoveConfig.MoveWidth-obj.offsetWidth;
H=AdMoveConfig.MoveHeight-obj.offsetHeight;
x
= x + step*kx*dirx;
if (x < 0){dirx = 1;x =
0;kx=Math.sin(rad);ky=Math.cos(rad);}
if (x > W){dirx = -1;x =
W;kx=Math.sin(rad);ky=Math.cos(rad);}
y = y + step*ky*diry;
if (y <
0){diry = 1;y = 0;kx=Math.sin(rad);ky=Math.cos(rad);}
if (y > H){diry =
-1;y = H;kx=Math.sin(rad);ky=Math.cos(rad);}
}
this.Run=function(){
var
delay = 10;
interval=setInterval(obj.CustomMethod,delay);
obj.onmouseover=function(){clearInterval(interval);}
obj.onmouseout=function(){interval=setInterval(obj.CustomMethod,
delay);}
}
}
//-->
</script>
</head>
<body>
<div
id="gg1"
style="width:100px;height:100px;background-color:red;color:yellow">
广告1
</div>
<div
id="gg2"
style="width:100px;height:100px;background-color:blue;color:yellow">
广告2
</div>
<div
id="gg3"
style="width:100px;height:100px;background-color:green;color:yellow">
广告3
</div>
<script
type="text/javascript">
<!--
var ad1=new
AdMove("gg1");
ad1.Run();
var ad2=new AdMove("gg2");
ad2.Run();
var
ad3=new
AdMove("gg3");
ad3.Run();
//-->
</script>
</body>
</html>

漂浮广告代码兼容ie、firefox，多个漂浮不冲突，调用只需两行代码的更多相关文章

  1. 只需一行代码！Python中9大时间序列预测模型

    在时间序列问题上,机器学习被广泛应用于分类和预测问题.当有预测模型来预测未知变量时,在时间充当独立变量和目标因变量的情况下,时间序列预测就出现了. 预测值可以是潜在雇员的工资或银行账户持有人的信用评分 ...

  2. Github 大牛封装 Python 代码，实现自动发送邮件只需三行代码

    *注意:全文代码可左右滑动观看 在运维开发中,使用 Python 发送邮件是一个非常常见的应用场景.今天一起来探讨一下,GitHub 的大牛门是如何使用 Python 封装发送邮件代码的. 一般发邮件 ...

  3. c# 输出excel、word实例只需一行代码

    第一.首先下载 WindICFrameNet.dll 下载地址:http://pan.baidu.com/s/1dDBqC9r 第二.前台代码 <div style="display: ...

  4. Iframe高度自适应（兼容IE/Firefox、同域/跨域）

    在实际的项目进行中,很多地方可能由于历史原因不得不去使用iframe,包括目前正火热的应用开发也是如此. 随之而来的就是在实际使用iframe中,会遇到iframe高度的问题,由于被嵌套的页面长度不固 ...

  5. gRaphael——JavaScript 矢量图表库：两行代码实现精美图表

    gRaphael 是一个致力于帮助开发人员在网页中绘制各种精美图表的 Javascript 库,基于强大的 Raphael 矢量图形库.你只需要编写几行简单的代码就能创建出精美的条形图.饼图.点图和曲 ...

  6. 两行代码搞定网站gzip压缩

    网站使用gzip压缩的好处就不用多说了吧,自行脑补,来说一下如何使用nodejs实现gzip压缩,只需要两行代码,so ease. 通过nodejs实现gzip 需要用到的模块 compression ...

  7. JavaScript浮动广告代码，容纯DIV/CSS对联漂浮广告代码，兼容性非常好的js右下角与漂浮广告代码

    基于JavaScript代码实现随机漂浮图片广告,javascript图片广告 在网上有很多这样的代码,不过未必符合W3C标准,因为在头部加上<!DOCTYPE html>类似标签之后,漂 ...

  8. Js弹性漂浮广告代码

    <html><head><meta http-equiv="Content-Type" content="text/html; charse ...

  9. JQuery漂浮广告代码

    <!doctype html><html><head><meta charset="utf-8"><title>jque ...

随机推荐

  1. accept功能

    accept()功能 系统调用 accept() 这将是一个有点陌生的地方! 你可以想象发生 这种事情:这是非常远离你通过倾听 (listen()) 的port连接 (connect()) 你的机器. ...

  2. iOS缓存类的设计

    使用执行速度缓存的程序可以大大提高程序,设计一个简单的缓存类并不需要太复杂的逻辑. 只需要一个简单的3接口. 存款对象 以一个对象 删除对象 阅读对象 watermark/2/text/aHR0cDo ...

  3. 输出无名空数组---精android、IOS App应用服务程序开发

    直接输出 [] 示例文件_samples/app/array_null.json在轻开平台的_samples/app/文件夹下 太Easy.无法写出很多其它的内容,大家还是自己试试吧! ! ! 相关资 ...

  4. Arcgis for Js之Graphiclayer扩展具体解释

    在前两节,讲到了两种不同方式的聚类,一种是基于距离的,一种是基于区域范围的,两种不同的聚类都是通过扩展esri/layers/GraphicsLayer方法来实现的.在本节,就具体的讲讲esri/la ...

  5. 【程序员联盟】官网上线啦！coderunity.com

    内容简介 欢天喜地,[程序员联盟]官网上线咯(此处应该有鸡蛋丢过来...) [程序员联盟]官网 大家也许会问:“这几天小编都没出文章,跑哪里happy去啦?是不是偷懒去了?” 小编:“臣妾冤枉啊.” ...

  6. swift 笔记 (十二) —— 下标

    下标 swift同意我们为 类.结构体,枚举 定义下标,以更便捷的方式訪问一大堆属性.比方Array和Dictionary都是结构体,swift的project师已经为这两个类型提供好了下标操作的代码 ...

  7. Spring.net-业务层仓储

    Spring.net-业务层仓储 本系列目录:ASP.NET MVC4入门到精通系列目录汇总 上一节,我们已经把项目框架的雏形搭建好了,那么现在我来开始业务实现,在业务实现的过程当中,不断的来完善我们 ...

  8. HDU更多的学校比赛9场 HDU 4965Fast Matrix Calculation【矩阵运算+数学技巧】

    困难,.,真,,,不是太困难 的问题是,有一个矩阵运算优化 您有权发言权N*K矩阵A给K*N矩阵B(1<=N<=1000 && 1=<K<=6).他们拿起了第一 ...

  9. Android client和服务器JSP互传中国

    出于兼容性简化.传统中国等多国语言.推荐使用UTF-8编码. 首选.我们期待Android到底应该怎么办: 在发送前,应该对參数值要进行UTF-8编码,我写了一个static的 转换函数.在做发送动作 ...

  10. IIS7和IIS7.5备份和还原的方法

    windows2008的iis配置备份和iis6不同,在iis7中没有了6原来的保存配置xml的选项,而采用的是dos命令来进行iis7的备份.以下是win2008上iis7备份的方法. 首先打开CM ...