2010年7月7日水曜日

footerの高さをページに合わせて一番下に配置するコードメモ

footerを画面一番下に配置したいと思い、
min-heightをつかって、さらにIE6対策に、height:auto !important;height:~px;とやるのが面倒だし、「jQueryでやっちゃえ」と思ってできたのでメモです。

#footer(例:35px)を画面の高さに合わせてページの一番下に配置するjQueryコード。

    var docHeight=$(document).height();//ドキュメントの高さ取得
//ドキュメントの高さが、ページの高さと同じなら、footer分の高さを引き、そうでなければそのまま。(三項演算子って便利)
   var footerHeight=docHeight==$(window).height()?docHeight-35:docHeight;
   $("#footer").css({position:"absolute",top:footerHeight});//直接jQueryで position:absoluteにしてしまい、topからの高さを指定。 

0 件のコメント:

コメントを投稿