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

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

解决方案 »

  1.   

    楼主 看看 懒人的 对联广告http://www.lanrentuku.com/js/duilian.html
      

  2.   

     
    <!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>
      

  3.   

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

  4.   


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

  5.   

    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">这句话，上面的浮动效果就不出来？
      

  6.   


    写错了，是有下面这句话两边广告效果就不出来，请问怎样兼容？？<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
      

  7.   

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

  8.   

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