1.[普通效果]
现在很多网站广告做的如火如荼,现在我就来介绍一下常见的对联浮动广告效果的代码使用方法,介绍的这种效果,在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: 0POSITION: absolutewidth: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>' target=_blank)
theFloaters.addItem('followDiv2',0,0,'<br><a href=广告链接地址 target=_blank><img src=广告图片地址 width=100 height=400 border=0></a>' target=_blank)
theFloaters.play()
把上面的代码另存为一个JS文件,然后在想实现此效果的页面用 调用即可!注意修改广告图片地址和连接地址!
2.[鼠标感应]
与前面一个代码不同的是,当鼠标移动到广告图片上是可以感应显示另外设置好的广告大图效果,下面就是实现效果所需代码:
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:absolutevisibility: 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:absolutevisibility: 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文件,然后在想实现此效果的页面用
<script type="text/javascript" language="javascript1.2" src="*.js"></SCRIPT>
调用即可,*代表你另存的文件名!注意修改广告图片地址和连接地址!
3.[允许关闭]
与前面两个代码不同的是,广告图下方增加了一个图片按纽,允许访客点击关闭广告图片,下面文本框中就是实现效果所需代码:
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: absolutewidth: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文件,然后在想实现此效果的页面用 调用即可,*代表你另存的文件名!注意修改广告图片地址和连接地址!
4.[浮动对联广告---之左侧代码]
如果您想只有一侧显示的话,下面是实现左侧效果所需代码:
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( target=_blank)void(0)'
class=closefloat><b><font color=#ff0000>关闭</font></b></a></td></tr>"
+"</table>"
+"</div>")
myload()}
把上面的代码另存为一个*.JS文件,然后在想实现此效果的页面用
CODE:
<script src="*.js"></SCRIPT>
调用即可,*代表你另存的文件名!注意修改广告图片地址和连接地址!相应的参数可以根据页面自行调整
5.背投广告
<script language="javascript">
<!--
var sohu=window.open('http://www.sohu.com')
var ads=window.open('about:blank','ads','width=700,height=400')
sohu.focus()
ads.document.open()
ads.document.write ("<html><head><title>ads</title></head><body>This is background ads</body></html>")
ads.document.close()
//-->
</script>
6.收缩广告
<script language="javascript">
<!--
var bwidth=800
var bheight=400
function go() {
bwidth = bwidth - 10
bheight = bheight - 5
if(bwidth <= 10)
{ ads.style.display='none'clearTimeout("my")}
else
{ ads.outerHTML='<span id="ads" style="width:'+bwidth+'pxheight:'+bheight+'pxbackground-color:#0099FF"></span>'}
var my=setTimeout("go()",50)
}
setTimeout("go()",6000)
//-->
</script>
<body topmargin="0" leftmargin="0">
<div align="center"><span id="ads" style="width:800pxheight:400pxbackground-color:#0099FF"></span></div>
</body>
asp的网站的话,一般很少是数据和模板分开的,此时你就必须在相应的asp页面上手动将你得到的那些html文件的代码粘贴到asp文件了。说的有点绕口,不过懂html知识的应该都会的。
如果你要是用的aspcms这个cms系统的话,可以加到模板公共文件里面。一般是footer.html这个文件。
1.用记事本打开你下载的那个代码文件,超找到原文件中广告字体处.在这个里修改成为你的就改好了.2.打开你的ftp空间中的www根目录.
3.在www文件夹里查找的你的index.asp(或者index其他类型的).用记事本打开.找到这个网页最后</body>处.把代码放到上边,保存首页.在运行的网站就成功了!
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)