开发者社区> 科技探索者> 正文
阿里云
为了无法计算的价值
打开APP
阿里云APP内打开

对联广告代码效果大全

简介:
+关注继续查看

对联广告代码效果大全

现在很多网站广告做的如火如荼,现在我就来介绍一下常见的对联浮动广告效果的代码使用方法,介绍的这种效果,在1024*768分辨率下正常显示,在800*600的分辨率下可以自动隐藏,以免遮住页面影响访问者浏览内容,下面就是实现效果所需代码:

var delta=0.015
var collection;
function floaters() {
this.items = [];
this.addItem = function(id,x,y,content)
{
document.write('<DIV id='+id+' style="Z-INDEX: 0; POSITION: absolute; width:80px; height:60px;left:'+(typeof(x)=='string'?eval(x):x)+';top:'+(typeof(y)=='string'?eval(y):y)+'">'+content+'</DIV>');

var newItem = {};
newItem.object = document.getElementById(id);
newItem.x = x;
newItem.y = y;

this.items[this.items.length] = newItem;
}
this.play = function()
{
collection = this.items
setInterval('play()',10);
}
}
function play()
{
if(screen.width<=800)
{
for(var i=0;i<collection.length;i++)
{
collection[i].object.style.display = 'none';
}
return;
}
for(var i=0;i<collection.length;i++)
{
var followObj = collection[i].object;
var followObj_x = (typeof(collection[i].x)=='string'?eval(collection[i].x):collection[i].x);
var followObj_y = (typeof(collection[i].y)=='string'?eval(collection[i].y):collection[i].y);

if(followObj.offsetLeft!=(document.body.scrollLeft+followObj_x)) {
var dx=(document.body.scrollLeft+followObj_x-followObj.offsetLeft)*delta;
dx=(dx>0?1:-1)*Math.ceil(Math.abs(dx));
followObj.style.left=followObj.offsetLeft+dx;
}

if(followObj.offsetTop!=(document.body.scrollTop+followObj_y)) {
var dy=(document.body.scrollTop+followObj_y-followObj.offsetTop)*delta;
dy=(dy>0?1:-1)*Math.ceil(Math.abs(dy));
followObj.style.top=followObj.offsetTop+dy;
}
followObj.style.display = '';
}


var theFloaters = new floaters();
theFloaters.addItem('followDiv1','document.body.clientWidth-100',0,'</a><br><a href=广告链接地址 target=_blank><img src=广告图片地址 width=100 height=400 border=0></a>');
theFloaters.addItem('followDiv2',0,0,'<br><a href=广告链接地址 target=_blank><img src=广告图片地址 width=100 height=400 border=0></a>');
theFloaters.play();

本文转自分瓜博客51CTO博客,原文链接http://blog.51cto.com/aiqing/896如需转载请自行联系原作者

aiqing

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
【最新】男士护肤品十大排行品牌,用过的都已经成为男神脸了
护肤对于很多男士来说确实没啥天赋,所以网上经常会有所谓的男士护肤品十大排行品牌介绍,所以今天我就和大家分享下一些适合男士常用的护肤品牌集合。
0 0
刷屏的ZAO换脸APP你玩了吗?里面的霸王条款你造吗?
你的朋友圈被换脸视频刷屏了吗?昨天,一款换脸手机 APP——Zao 在各大应用商店上线,还不到一天的时间就在微博、朋友圈等各大平台刷屏。和此前大热的各种 deepfakes 视频一样,这款 APP 也可以实现换脸功能。不同的是,这次,换脸的门槛再一次降低,每个人都可以在手机上制作换脸视频了。但是,在上传照片之前,请详细阅读《用户协议》。
0 0
WWDC上这个神级功能,一言不合又要改变未来购物趋势
在 2017 年的 WWDC 上,最令科技爱好者们动容的,其实是苹果关于 AR 终于开了金口,公布了名叫 ARKit 的增强现实(AR)平台的上线。谷歌、Facebook、微软,在这个领域都已捷足先登,在AR上做出了点成绩:Tango、Camera Effects、Hololens。
1426 0
文章
问答
文章排行榜
最热
最新
相关电子书
更多
微信广告引擎与播放节奏算法实践
立即下载
「D2之夜」图文与视频的营销创意解决方案
立即下载
地产界的“苹果”是怎样炼成的
立即下载