<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head
<body>
  <div id="fixed" style="width: 100%; height:66px; width:100%; background:#F00; border:solid 1px #000;"></div>
  <div style="height:2000px;" title="请拖动滚动条"></div>
  
  <script type="text/javascript"> var ph=(document.body.offsetHeight -70)+"px";
var pw=(document.documentElement.offsetWidth -70)+"px";
  var position = function(){
      var isIE6 = !-[1,] && !window.XMLHttpRequest,
          html = document.getElementsByTagName('html')[0],
          dd = document.documentElement,
          db = document.body,
          dom = dd || db,
          // 获取滚动条位置
          getScroll = function(win){
              return {
                  left: Math.max(dd.scrollLeft, db.scrollLeft),
                  top: Math.max(dd.scrollTop, db.scrollTop)
                  };
          };      if (isIE6 && document.body.currentStyle.backgroundAttachment !== 'fixed') {
          html.style.backgroundImage = 'url(about:blank)';
          html.style.backgroundAttachment = 'fixed';
      };      return {
          fixed: isIE6 ? function(elem){
              var style = elem.style,
                  doc = getScroll(),
                  dom = '(document.documentElement || document.body)',
                  left = parseInt(style.left) - doc.left,
                  top = parseInt(style.top) - doc.top;
              this.absolute(elem);
              style.setExpression('left', 'eval(' + dom + '.scrollLeft + ' + left + ') + "px"');
              style.setExpression('top', 'eval(' + dom + '.scrollTop + ' + top + ') + "px"');
          } : function(elem){
              elem.style.position = 'fixed';
          },          absolute: isIE6 ? function(elem){
              var style = elem.style;
              style.position = 'absolute';
              style.removeExpression('left');
              style.removeExpression('top');
          } : function(elem){
           elem.style.position = 'absolute';
          }
      };
  }(); 
    //获取浏览器高度
    var elem = document.getElementById('fixed');
   var  btop = document.documentElement.clientHeight - 66;
      elem.style.left = '0px';
      elem.style.top = btop+'px';
      position.fixed(elem);  </script>
  </body>
  </html>现在我已经做到 兼容各个浏览器  都是在底部显示DIV  但是如果改变浏览器的窗口大小 就不动了  这样 该怎么解决 比如说你浏览器视窗 本来没有全屏 是缩小化看的 然后全屏了 但是底部DIV不会跟着你浏览器视窗变化而变化  这该怎么解决

解决方案 »

  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>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    </head
    <body>
      <div id="fixed" style="width: 100%; height:66px; width:100%; background:#F00; border:solid 1px #000;"></div>
      <div style="height:2000px;" title="请拖动滚动条"></div>
      
      <script type="text/javascript">    var ph=(document.body.offsetHeight -70)+"px";
        var pw=(document.documentElement.offsetWidth -70)+"px";
      var position = function(){
          var isIE6 = !-[1,] && !window.XMLHttpRequest,
              html = document.getElementsByTagName('html')[0],
              dd = document.documentElement,
              db = document.body,
              dom = dd || db,
              // 获取滚动条位置
              getScroll = function(win){
                  return {
                      left: Math.max(dd.scrollLeft, db.scrollLeft),
                      top: Math.max(dd.scrollTop, db.scrollTop)
                      };
              };      if (isIE6 && document.body.currentStyle.backgroundAttachment !== 'fixed') {
              html.style.backgroundImage = 'url(about:blank)';
              html.style.backgroundAttachment = 'fixed';
          };      return {
              fixed: isIE6 ? function(elem){
                  var style = elem.style,
                      doc = getScroll(),
                      dom = '(document.documentElement || document.body)',
                      left = parseInt(style.left) - doc.left,
                      top = parseInt(style.top) - doc.top;
                  this.absolute(elem);
                  style.setExpression('left', 'eval(' + dom + '.scrollLeft + ' + left + ') + "px"');
                  style.setExpression('top', 'eval(' + dom + '.scrollTop + ' + top + ') + "px"');
              } : function(elem){
                  elem.style.position = 'fixed';
              },          absolute: isIE6 ? function(elem){
                  var style = elem.style;
                  style.position = 'absolute';
                  style.removeExpression('left');
                  style.removeExpression('top');
              } : function(elem){
               elem.style.position = 'absolute';
              }
          };
      }(); 
        //获取浏览器高度
        var elem = document.getElementById('fixed');
       var  btop = document.documentElement.clientHeight - 66;
          elem.style.left = '0px';
          elem.style.top = btop+'px';
          position.fixed(elem);    this.onresize = function(){
          btop = document.documentElement.clientHeight - 66;
          elem.style.left = '0px';
          elem.style.top = btop+'px';
          position.fixed(elem);
      }
      </script>
      </body>
      </html>
    加个onresize事件监听。
      

  2.   

    大哥 IE6下不行啊   就是IE6有问题
      

  3.   

    <!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>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    </head>
    <body>
      <div id="fixed" style="width: 100%; height:66px; width:100%; background:#F00; border:solid 1px #000;"></div>
      <div style="height:2000px;" title="请拖动滚动条"></div>
      
      <script type="text/javascript">    var ph=(document.body.offsetHeight -70)+"px";
        var pw=(document.documentElement.offsetWidth -70)+"px";
      var position = function(){
          var isIE6 = !-[1,] && !window.XMLHttpRequest,
              html = document.getElementsByTagName('html')[0],
              dd = document.documentElement,
              db = document.body,
              dom = dd || db,
              // 获取滚动条位置
              getScroll = function(win){
                  return {
                      left: Math.max(dd.scrollLeft, db.scrollLeft),
                      top: Math.max(dd.scrollTop, db.scrollTop)
                      };
              };      if (isIE6 && document.body.currentStyle.backgroundAttachment !== 'fixed') {
              html.style.backgroundImage = 'url(about:blank)';
              html.style.backgroundAttachment = 'fixed';
          };      return {
              fixed: isIE6 ? function(elem){
                  var style = elem.style,
                      doc = getScroll(),
                      dom = '(document.documentElement || document.body)',
                      left = parseInt(style.left) - doc.left,
                      top = parseInt(style.top) - doc.top;
                  this.absolute(elem);
                  style.setExpression('left', 'eval(' + dom + '.scrollLeft + ' + left + ') + "px"');
                  style.setExpression('top', 'eval(' + dom + '.scrollTop + ' + top + ') + "px"');
              } : function(elem){
                  elem.style.position = 'fixed';
              },          absolute: isIE6 ? function(elem){
                  var style = elem.style;
                  style.position = 'absolute';
                  style.removeExpression('left');
                  style.removeExpression('top');
              } : function(elem){
               elem.style.position = 'absolute';
              }
          };
      }(); 
        //获取浏览器高度
      function func()
      {
        var elem = document.getElementById('fixed');
       var  btop = document.documentElement.clientHeight - 66;      elem.style.left = '0px';
          elem.style.top = btop+'px';
          position.fixed(elem);
      }
      func()
      window.onresize=func;
      </script>
      </body>
      </html>你那个 <head>标签写成 "<head"  了  ,少了 个 ">",下面的代码能兼容ie了