<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<style>
*{margin: 0padding: 0}
.Ad{
position: fixed
width: 140px
height: 500px
background: #db3e52
top: -moz-calc(50% - 250px)
top: -webkit-calc(50% - 250px)
top: calc(50% - 250px)
}
div.Ad:nth-child(1){
left: 2%
}
div.Ad:nth-child(2){
right:2%
}
</style>
</head>
<body>
<div class="Ad"></div>
<div class="Ad"></div>
</body>
</html>
CODE: var delta=0.015var collection
function floaters() {
this.items= []
this.addItem= function(id,x,y,content)
{
document.write('<DIV id='+id+' style="Z-INDEX: 0POSITION: absolute width:80pxheight:60pxleft:'+(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=0i<collection.lengthi++)
{
collection[i].object.style.display= 'none'
}
return
}
for(var i=0i<collection.lengthi++)
{
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()
把上面的代码另存为一个JS文件，然后在想实现此效果的页面用 调用即可！注意修改广告图片地址和连接地址！
[鼠标感应]
与前面一个代码不同的是，当鼠标移动到广告图片上是可以感应显示另外设置好的广告大图效果，下面就是实现效果所需代码：
CODE:function bigshow(){
document.all.div_250.style.visibility = 'visible'
document.all.div_80.style.visibility = 'hidden'
}
function bighide(){
document.all.div_80.style.visibility = 'visible'
document.all.div_250.style.visibility = 'hidden'
}
var ad_80= new Array(1)
var ad_250= new Array(1)
ad_80[0]="<a href=http://www.dfeng.net target=_blank><img src=/skin/adv43/ad/ad_ad.gif border=0></a>"
ad_250[0]="<a href=http://www.dfeng.net target=_blank><img src=/skin/adv43/ad/ad_ad2.gif border=0></a>"
var imgheight
var fubioleft
window.screen.width>800 ? fubioleft=15:fubioleft=15
document.write('<DIV id=floater_left style="Z-INDEX: 25LEFT:'+fubioleft+'pxWIDTH: 28pxPOSITION: absoluteTOP: 42pxHEIGHT: 22px">')
ad_now = new Date()
ad_id= ad_now.getSeconds() %1
var adhead1="<div id=div_80 style='position:absolutewidth:95pxheight:62pxz-index:12' onMouseOver=bigshow()>"
var adhead2="</div><div id=div_250 style='position:absolute visibility: hiddenz-index:13width: 80height: 60' onMouseOut=bighide()>"
//var adhead1="<div id=div_80 style='position:absolutewidth:95pxheight:62pxz-index:20' onMouseOut='//MM_showHideLayers(\"div_250\",\"\",\"hide\")' onMouseOver='MM_showHideLayers(\"div_250\",\"\",\"show\")'>"
//var adhead2="</div><div id=div_250 style='position:absolutez-index:21visibility: hiddenwidth: 80height: 60' onMouseOver='MM_showHideLayers(\"div_250\",\"\",\"show\")' onMouseOut='MM_showHideLayers(\"div_250\",\"\",\"hide\")'>"
document.write(adhead1+ad_80[ad_id]+adhead2+ad_250[ad_id]+"</div>")
document.write ("</div>")
self.onError=null
currentX = currentY = 0
whichIt = null
lastScrollX = 0lastScrollY = 0
NS = (document.layers) ? 1 : 0
IE = (document.all) ? 1: 0
function heartBeat() {
if(IE) {
diffY = document.body.scrollTop
diffX = document.body.scrollLeft}
if(NS) {
diffY = self.pageYOffsetdiffX = self.pageXOffset}
if(diffY != lastScrollY) {
percent = .5 * (diffY - lastScrollY)
if(percent >0) percent = Math.ceil(percent)
else percent = Math.floor(percent)
if(IE) document.all.floater_left.style.pixelTop += percent
if(NS) document.floater_left.top += percent
lastScrollY = lastScrollY + percent
}
if(diffX != lastScrollX) {
percent = .5 * (diffX - lastScrollX)
if(percent >0) percent = Math.ceil(percent)
else percent = Math.floor(percent)
if(IE) document.all.floater_left.style.pixelLeft += percent
if(NS) document.floater_left.left += percent
lastScrollX = lastScrollX + percent
}
}
if(NS || IE) action = window.setInterval("heartBeat()",1)var ad_80= new Array(1)
var ad_250= new Array(1)
ad_80[0]="<a href=http://www.dfeng.net target=_blank><img src=/skin/adv43/ad/ad_ad.jpg border=0></a>"
ad_250[0]="<a href=http://www.dfeng.net target=_blank><img src=/skin/adv43/ad/ad_ad.jpg border=0></a>"
var imgheight
var fubioleft
window.screen.width>800 ? fubioleft=15:fubioleft=15
document.write('<DIV id=floater_right style="Z-INDEX: 25LEFT:'+fubioleft+'pxWIDTH: 28pxPOSITION: absoluteTOP: 42pxHEIGHT: 22px">')
ad_now = new Date()
ad_id= ad_now.getSeconds() %1
function myload()
{
if (navigator.appName == "Netscape")
{
document.div_right_80.pageX=+window.innerWidth-130
document.div_right_250.pageX=+window.innerWidth-300
mymove()
}
else
{
div_right_80.style.left=document.body.offsetWidth-130
div_right_250.style.left=document.body.offsetWidth-300
mymove()
}
}
function mymove()
{
if(document.ns)
{
document.div_right_80.left=pageXOffset+window.innerWidth-130
document.div_right_250.left=pageXOffset+window.innerWidth-300
setTimeout("mymove()",20)
}
else
{
div_right_80.style.left=document.body.scrollLeft+document.body.offsetWidth-145
div_right_250.style.left=document.body.scrollLeft+document.body.offsetWidth-300
setTimeout("mymove()",20)
}
}
var adhead1="<div id=div_right_80 style='position:absolutewidth:95pxheight:60pxz-index:12' onMouseOver=bigshow_right()>"
var adhead2="</div><div id=div_right_250 style='position:absolute visibility: hiddenz-index:13width: 250height: 250' onMouseOut=bighide_right()><div align=right>"
document.write(adhead1+ad_80[ad_id]+adhead2+ad_250[ad_id]+"</div></div>")
myload()
document.write ("</div>")
self.onError=null
currentX_right = currentY_right = 0
whichIt_right = null
lastScrollX_right = 0lastScrollY_right = 0
NS = (document.layers) ? 1 : 0
IE = (document.all) ? 1: 0
function heartBeat_right() {
if(IE) {
diffY_right = document.body.scrollTop
diffX_right = document.body.scrollLeft}
if(NS) {
diffY_right = self.pageYOffsetdiffX_right = self.pageXOffset}
if(diffY_right != lastScrollY_right) {
percent_right = .5 * (diffY_right - lastScrollY_right)
if(percent_right >0) percent_right = Math.ceil(percent_right)
else percent_right = Math.floor(percent_right)
if(IE) document.all.floater_right.style.pixelTop += percent_right
if(NS) document.floater_right.top += percent_right
lastScrollY_right = lastScrollY_right + percent_right
}
if(diffX_right != lastScrollX_right) {
percent_right = .5 * (diffX_right - lastScrollX_right)
if(percent_right >0) percent_right = Math.ceil(percent_right)
else percent_right = Math.floor(percent_right)
if(IE) document.all.floater_right.style.pixelLeft += percent_right
if(NS) document.floater_right.left += percent_right
lastScrollX_right = lastScrollX_right + percent_right
}
}
if(NS || IE) action = window.setInterval("heartBeat_right()",1)
function bigshow_right(){
document.all.div_right_250.style.visibility = 'visible'
document.all.div_right_80.style.visibility = 'hidden'
}
function bighide_right(){
document.all.div_right_80.style.visibility = 'visible'
document.all.div_right_250.style.visibility = 'hidden'
}document.write('')
document.write('')
document.write('')
把上面的代码另存为一个JS文件，然后在想实现此效果的页面用
CODE:<script type="text/javascript" language="javascript1.2" src="*.js"></SCRIPT>
调用即可，*代表你另存的文件名！注意修改广告图片地址和连接地址！
[允许关闭]
与前面两个代码不同的是，广告图下方增加了一个图片按纽，允许访客点击关闭广告图片，下面文本框中就是实现效果所需代码：
CODE:var delta=0.015
var collection
var closeB=false
function floaters() {
this.items = []
this.addItem = function(id,x,y,content)
{
document.write('<DIV id='+id+' style="Z-INDEX: 10POSITION: absolute width:80pxheight:60pxleft:'+(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()',30)
}
}
function play()
{
if(screen.width<=800 || closeB)
{
for(var i=0i<collection.lengthi++)
{
collection[i].object.style.display = 'none'
}
return
}
for(var i=0i<collection.lengthi++)
{
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 = ''
}
}
function closeBanner()
{
closeB=true
return
}
var theFloaters = new floaters()
//
theFloaters.addItem('followDiv1','document.body.clientWidth-100',0,'<a onClick="closeBanner()" href=http://www.dfeng.net target=_blank><img src=ad/doublead/right.gif width=100 height=554 border=0></a><br><br><img src=ad/doublead/close.gif onClick="closeBanner()">')
theFloaters.addItem('followDiv2',0,0,'<a onClick="closeBanner()" href=http://www.dfeng.net target=_blank><img src=ad/doublead/ad_ad.gif width=100 height=400 border=0 ></a><br><br><img src=ad/doublead/close.gif onClick="closeBanner()">')
theFloaters.play()
把上面的代码另存为一个JS文件，然后在想实现此效果的页面用 调用即可，*代表你另存的文件名！注意修改广告图片地址和连接地址！
浮动对联广告---之左侧代码
如果您想只有一侧显示的话,下面是实现左侧效果所需代码：
CODE:var ad_float_left_src ="图片地址"
var ad_float_left_url ="地址"
var ad_float_left_type = ""
document.ns = navigator.appName == "Microsoft Internet Explorer"
var imgheight_close
var imgleft
window.screen.width>800 ? imgheight_close=120:imgheight_close=120
window.screen.width>800 ? imgleft=8:imgleft=122
function myload()
{
myleft.style.top=document.body.scrollTop+document.body.offsetHeigh
t-imgheight_close
myleft.style.left=imgleft
leftmove()
}
function leftmove()
{
myleft.style.top=document.body.scrollTop+document.body.offsetHeigh
t-imgheight_close
myleft.style.left=imgleft
setTimeout("leftmove()",50)
}
function MM_reloadPage(init) { //reloads the window if Nav4
resized
if (init==true) with (navigator) {if ((appName=="Netscape")&&
(parseInt(appVersion)==4)) {
document.MM_pgW=innerWidthdocument.MM_pgH=innerHeight
onresize=MM_reloadPage}}
else if (innerWidth!=document.MM_pgW || innerHeight!
=document.MM_pgH) location.reload()
}
MM_reloadPage(true)
function close_float_left(){
myleft.style.visibility='hidden'
}
document.write("<div id=myleft style='position:
absolutewidth:80top:300left:5visibility: visiblez-index: 1'>"
+"<style>"
+"A.closefloat:link,A.refloat:visited {text-
decoration:nonecolor:#000000font-size:12px}"
+"A.closefloat:active,A.refloat:hover {text-decoration:underlinecolor:#0000FFfont-size:12px}"
+"</style>"
+"<table border=0 cellpadding=0 cellspacing=0><tr><td>")
if(document.ns){
if(ad_float_left_type!="swf")
document.write("<a href='" + ad_float_left_url + "' target
= '_blank'><img src='" + ad_float_left_src + "' WIDTH=88
height=31 border=0></a>")
else
document.write("<EMBED src='" + ad_float_left_src + "'
quality=high WIDTH=80 HEIGHT=80 TYPE='application/x-shockwave-
flash' id=changhongout ></EMBED>")
document.write("</td></tr><tr><td width=80 height=20
align=right><a href='javascript:close_float_left()void(0)'
class=closefloat><b><font color=#ff0000>关闭</font></b></a></td></tr>"
+"</table>"
+"</div>")
myload()}
把上面的代码另存为一个*.JS文件，然后在想实现此效果的页面用
CODE:<script src="*.js"></SCRIPT>
调用即可，*代表你另存的文件名！注意修改广告图片地址和连接地址！相应的参数可以根据页面自行调整。
欢迎分享，转载请注明来源：内存溢出
微信扫一扫
支付宝扫一扫
评论列表（0条）