-1

ページの下部に固定され、コンテンツとともに移動するフッターを作成するにはどうすればよいですか? を使ってみpositionたのですが、画面に収まりきらないコンテンツがあると、フッターが画面の一番下に表示され、その上にコンテンツが重なって表示されてしまいました。

4

4 に答える 4

0

フッター用のcssクラスを作成します-

footer.bottom {
    position: fixed;
    bottom: 0px;
}

jQuery よりも

if ( $(document).height() < $(window).height() ) {
    $('footer').addClass('bottom');
} else {
    $('footer').removeClass('bottom');
}

ボディがウィンドウより短い場合は、底にくっつくようにクラスを追加しますが、ボディが高い場合は正常です。

于 2013-11-07T09:15:57.753 に答える
0

この方法で問題が解決しました。フッターに関連するすべての問題を修正する必要があると思います。私の質問に答えてくれてありがとう。

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<style>
footer.bottom {
    position: fixed;
    bottom: 0px;
}
</style>
<script src="http://code.jquery.com/jquery.min.js"></script>
<script>
$(document).ready(function(){
if ( $('#x')[0].scrollHeight < $(window).height() ) {
    $('footer').addClass('bottom');
} else {
    $('footer').removeClass('bottom');
}
});
</script>
</head>
<body>
<div id="x">
<table height="1000" bgcolor="#999999">
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table>

    <footer>
    Lorem Ipsum
    </footer>

</div>
</body>
</html>
于 2014-01-17T06:04:23.453 に答える
-1

使用する場合:

position:fixed;
bottom:0px;

それはそれを行う必要があります

そしてwidth:100%;、あなたがそれを必要とするならば。

于 2013-11-07T09:14:49.373 に答える