求一个效果 就是吸附到网站底端的一个漂浮图片

无论网只能怎么上下拉滚动条这个 图片都紧紧的漂浮在网站最底下面这样的效果怎么做呢 

解决方案 »

  1.   


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml">
    <head>
      <style type="text/css" >
      /*Make position:fixed work in IE6!*/
    .fixed-bottom /* position fixed Bottom */{position:fixed;bottom:0;top:auto;}
    * html,* html body /* IE6 Fixed Position Jitter Fix */{background-image:url(about:blank);background-attachment:fixed;}
    * html .fixed-bottom /* IE6 position 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)));}  </style>
    </head>
    <body><div style="height:2000px;"></div>
    <img src="images/test2.jpg" class="fixed-bottom" />
    </body>
    </html>
      

  2.   

    楼主想吸附到哪儿就吸附到哪儿吧，jQuery对浏览器的兼容性比较好，expression只支持IE而已。//jQuery将div等固定在浏览器右上角的方法
    //$(window)：浏览器对象
    //$(document.body)：body对象
    //$(document):文档对象
    (function($){// 拓展自jQuery
    $.extend({// 静态方法写法(自定义一个叫osiris的类，避免与jQuery自身方法重名)
    osiris : {
    setTopRight : function($this){
    $this.css({"display": "block", "position": "absolute", "text-align": "right"})
    .animate( { 
    left : $(window).width() - $this.width()
    }, 0)
    $(window).scroll(function(){
    $this.animate( { 
    top : $(document.body).scrollTop(), 
    left : $(window).width() - $this.width() + $(document.body).scrollLeft()
    }, 0);
    }).resize(function(){
    $this.animate( { 
    left : $(window).width() - $this.width() 
    }, 0);
    });
    }
    }
    });
    $.fn.extend({// 实例方法写法(这个我不会用自定义类的方法写成可以像“$(selector).osiris.setTopRight()”这样调用，会的同学欢迎提意见)
    setTopRight : function(){
    var $this =$(this);
    $this.css({"display": "block", "position": "absolute", "text-align": "right"})
    .animate( { 
    left : $(window).width() - $this.width()
    }, 0)
    $(window).scroll(function(){
    $this.animate( { 
    top : $(document.body).scrollTop(), 
    left : $(window).width() - $this.width() + $(document.body).scrollLeft()
    }, 0);
    }).resize(function(){
    $this.animate( { 
    left : $(window).width() - $this.width() 
    }, 0);
    });
    }
    });
    })(jQuery);// 调用方法
    $(document).ready(function(){
    //$("#topRight").setTopRight();  //（1）实例方法，自身调用
    $.osiris.setTopRight($("#topRight"));  //（2）静态方法，调用jQuery的自定义类osiris里面的静态方法
    })// 用法：控件的直接parent标签必须是body，貌似是吧……
    <body>
    <div id="topRight" style="width:100px; position: absolute;">topRight</>
    </body>//用animate是因为我的浏览器ie8用offset()只能取值却改不了值，暂时不知道为啥……
      

  3.   

    楼上的代码具体怎么使用?
    我的图片文件名在那里修改 放到index.htm主页里的代码是 最下面的那行吗?
      

  4.   

    your key css codes is here:
    position:fixed;
    bottom:0;