在网上找了好多,不是不能滚动,就是写的比较复杂,下面这个感觉还不错
以下为js代码 ,保存名称与调用名称相同 ,此处采用ad.js:
1
// 这是关闭飘浮广告的宽度,请根据你的广告内容而定
2
var hbcms_ad_width = 100;
3
4
// 这是关闭飘浮广告的代码,可以换成图片,点击即可关闭
5
var hbcms_close_str = '<div onClick="closeBanner();" style="color:gray;font-size:10pt;cursor:hand;text-align:center;width:100%;background-color: #efefef;line-height:200%">关闭</div>';
6
7
// 设置左边的广告代码,请自己更换图片地址,或换成flash,或换成纯文字
8
// 如果不希望显示左边的广告,可设置为 = '';
9
10
//src为flash路径
11
var hbcms_left_ad = '<embed src="c.swf" width="100" height="300" quality="high" wmode="window"></embed>' + hbcms_close_str;
12
13
14
// 设置右边的广告代码,如果要和左边的广告一致,可设为 = hbcms_left_ad;
15
// 如果不希望显示右边的广告,可设置为 = '';
16
var hbcms_right_ad = '<embed src="c.swf" width="100" height="300" quality="high" wmode="window"></embed>' + hbcms_close_str;
17
18
19
var delta=0.8;
20
var collection;
21
var closeB=false;
22
23
function floaters()
{
24
this.items = [];
25
this.addItem = function(id,x,y,content)
26
{
27
document.write('<DIV id='+id+' style="Z-INDEX: 10; POSITION: absolute; width:'+hbcms_ad_width+'px; height:300px;left:'+(typeof(x)=='string'?eval(x):x)+';top:'+(typeof(y)=='string'?eval(y):y)+'">'+content+'</DIV>');
28
29
var newItem =
{};
30
newItem.object = document.getElementById(id);
31
newItem.x = x;
32
newItem.y = y;
33
34
this.items[this.items.length] = newItem;
35
}
36
this.play = function()
37
{
38
collection = this.items
39
setInterval('play()',30);
40
}
41
}
42
43
44
function play()
45

{
46
if(screen.width<=800 || closeB)
47
{
48
for(var i=0;i<collection.length;i++)
49
{
50
collection[i].object.style.display = 'none';
51
}
52
return;
53
}
54
for(var i=0;i<collection.length;i++)
55
{
56
var followObj = collection[i].object;
57
var followObj_x = (typeof(collection[i].x)=='string'?eval(collection[i].x):collection[i].x);
58
var followObj_y = (typeof(collection[i].y)=='string'?eval(collection[i].y):collection[i].y);
59
60
if(followObj.offsetLeft!=(document.body.scrollLeft+followObj_x))
{
61
var dx=(document.body.scrollLeft+followObj_x-followObj.offsetLeft)*delta;
62
dx=(dx>0?1:-1)*Math.ceil(Math.abs(dx));
63
followObj.style.left=followObj.offsetLeft+dx;
64
}
65
66
if(followObj.offsetTop!=(document.documentElement.scrollTop+followObj_y))
{
67
var dy=(document.documentElement.scrollTop+followObj_y-followObj.offsetTop)*delta;
68
dy=(dy>0?1:-1)*Math.ceil(Math.abs(dy));
69
followObj.style.top=followObj.offsetTop+dy;
70
}
71
followObj.style.display = '';
72
}
73
}
74
function closeBanner()
75

{
76
closeB=true;
77
return;
78
}
79
80
81
var theFloaters = new floaters();
82
83
theFloaters.addItem('followDiv1','document.body.clientWidth-106',hbcms_ad_width,hbcms_right_ad);
84
//右面广告属性,分别是id,x,y,content
85
theFloaters.addItem('followDiv2',6,hbcms_ad_width,hbcms_left_ad);
86
//左面广告属性,分别是id,x,y,content
87
theFloaters.play();
88
89
以下为页面代码,可只复制"<script language=javascript src="ad.js"></script >"到页面的body中.
1
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2
<html xmlns="http://www.w3.org/1999/xhtml">
3
<head>
4
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
5
<title>js 实现页面两边广告, 可关闭对联广告 随滚动条滚动 符合w3c标准</title>
6
<style type="text/css">
7
</style>
8
</head>
9
10
<body>
11
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
12
13
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
14
15
<br><br><br><br><br><br><br><br><br><br><br>
16
<script language=javascript src="ac.js"></script ><!--调用js-->
17
</body>
18
</html>
19
转自http://hi.baidu.com/tianxin2580/blog/item/7ed2079b4c19dcb0c8eaf46a.html
posted on 2009-07-02 16:00
JasonChou 阅读(5635)
评论(4) 编辑 收藏 所属分类:
html