求一个网页两边随滚动条移动的广告的制作方法

danlansexinqing 2011-09-26 11:30:24

求一个网页两边随滚动条移动的广告的制作方法，要加的广告是图片

...全文

330 8 打赏收藏转发到动态举报

写回复

用AI写文章

8 条回复

切换为时间正序

请发表友善的回复…

发表回复

李志遠 2013-03-04

打赏
举报

使用jquery插件 Portamento http://site518.net/jquery-floating-panels-with-portamento/

ArLUO20 2013-03-02

打赏
举报

改为<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

001007009 2011-09-26

打赏
举报

楼主看看懒人的对联广告

http://www.lanrentuku.com/js/duilian.html

danlansexinqing 2011-09-26

打赏
举报

[Quote=引用 5 楼 danlansexinqing 的回复:]
suspendcode="<DIV id=lovexin1 style='Z-INDEX: 10; LEFT: 6px; POSITION: absolute; TOP: 105px; width: 130; height: 314px;'><img src='images/close.gif' onClick='javascript:window.hide()' width='130' heig……
[/Quote]

写错了，是有下面这句话两边广告效果就不出来，请问怎样兼容？？

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

danlansexinqing 2011-09-26

打赏
举报

suspendcode="<DIV id=lovexin1 style='Z-INDEX: 10; LEFT: 6px; POSITION: absolute; TOP: 105px; width: 130; height: 314px;'><img src='images/close.gif' onClick='javascript:window.hide()' width='130' height='14' border='0' vspace='3' alt='关闭对联广告'><a href='http://www.123.com/' target='_blank'><img src='images/gg.gif' width='130' height='300' border='0'></a></DIV>"
document.write(suspendcode);

suspendcode="<DIV id=lovexin2 style='Z-INDEX: 10; RIGHT: 6px; POSITION: absolute; TOP: 105px; width: 130; height: 314px;'><img src='images/close.gif' onClick='javascript:window.hide()' width='130' height='14' border='0' vspace='3' alt='关闭对联广告'><a href='http://www.123.com/' target='_blank'><img src='images/gg.gif' width='130' height='300' border='0'></a></DIV>"
document.write(suspendcode);

lastScrollY=0;
function heartBeat(){
diffY=document.body.scrollTop;
percent=.3*(diffY-lastScrollY);
if(percent>0)percent=Math.ceil(percent);
else percent=Math.floor(percent);
document.all.lovexin1.style.pixelTop+=percent;
document.all.lovexin2.style.pixelTop+=percent;
lastScrollY=lastScrollY+percent;
}
function hide()
{
lovexin1.style.visibility="hidden";
lovexin2.style.visibility="hidden";
}

window.setInterval("heartBeat()",1);

为什么在引用上面js的html页面中有<html xmlns="http://www.w3.org/1999/xhtml">这句话，上面的浮动效果就不出来？

danlansexinqing 2011-09-26

打赏
举报

[Quote=引用 1 楼 calmcrime 的回复:]
楼主看看懒人的对联广告

http://www.lanrentuku.com/js/duilian.html
[/Quote]

为什么有下面这句话浮动广告的效果就不出来，怎样能够兼容？
<html xmlns="http://www.w3.org/1999/xhtml">

BLUE_LG 2011-09-26

打赏
举报

其实，何必呢？
css中的position:fixed;
就可以了啊。。。

hch126163 2011-09-26

打赏
举报





 

<!doctype html>

<html dir="ltr" lang="zh-CN">

  <head>

    <meta charset="utf-8"/>

    <title>CSS Position Fixed for IE6</title>

    <style>





* html,* html body   {background-image:url(about:blank);background-attachment:fixed;}

* html .fixed-top    {position:absolute;bottom:auto; top:expression(eval(document.documentElement.scrollTop +(document.documentElement.clientHeight-this.offsetHeight)/2 ));}

* html .fixed-right  {position:absolute;right:0px;left:auto;}

* html .fixed-bottom {position:absolute;bottom:auto;top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0)));}

* html .fixed-left   {position:absolute;right:auto;left:expression(eval(document.documentElement.scrollLeft));}

.fixed-bottom  {

  position:fixed;

  left:0px;

  bottom:20px;

  background:aqua;

  width:200px;

  height:200px;

}

.fixed-right{

  position:fixed;

  right:0px;

  left:auto;

  top:200px;

  top:expression(eval(document.documentElement.scrollTop +(document.documentElement.clientHeight-this.offsetHeight)/2 ));

  background:red;

  width:200px;

  height:200px;

}

.fixed-top{

  position:fixed;

  top:0px;

  left:0px;

  background:blue;

  width:200px;

  height:200px;

}

    </style>



  </head>

  <body>

  <div style='height:2000px;width:500px;margin:10px auto; border:1px solid red;'></div>

   <div class="fixed-top"></div>

    <div class="fixed-bottom"></div>

     <div class="fixed-right"></div>

    

  

  </body>

</html>