代码之家  ›  专栏  ›  技术社区  ›  Alex

jquery,如果内容还没有变大,则将div height更改为自动填充屏幕的其余部分。

  •  0
  • Alex  · 技术社区  · 16 年前

    我的网站大致结构如下:

    -----------------
          header
    -----------------
         |           
         |           
     side|    main  
         |
         |
    -----------------
          footer
    

    我试图让我的“主”DIV获取屏幕上的所有剩余高度(并在窗口调整大小时调整大小),以便“页脚”总是自动推到屏幕底部(似乎卡在屏幕底部)。

    但是,我只希望在“main”DIV的内容还没有达到那个高度甚至更大的时候发生这种情况。我正在使用jquery,但是我很难正确地计算出它。有人能给我一个指向正确方向的指针吗?

    1 回复  |  直到 16 年前
        1
  •  2
  •   gblazex    16 年前

    方法被调用 粘脚 你不需要jquery。你可以使用 CSS :

    [ See it in action ]

    /* 
    Sticky Footer by Ryan Fait
    http://ryanfait.com/sticky-footer/ 
    */
    
    * {
     margin: 0;
    }
    html, body {
     height: 100%;
    }
    .wrapper {
     min-height: 100%;
     height: auto !important;
     height: 100%;
     margin: 0 auto -142px; /* the bottom margin is the negative 
                                  value of the footer's height */
    }
    .footer, .push {
     height: 142px; /* .push must be the same height as .footer */
    }