問題タブ [sticky-footer]

スティッキー フッター cssを使用してページの下部に保持するフッターがあります。フッターを折りたたんで開始し、ユーザーがボタンをクリックしたときに展開してから、「展開」リンクをdivフッター内の別のコンテナーと交換しdivます。

jQuery、HTML、および CSS を使用してこれを達成するにはどうすればよいですか?

編集：

フッターは約20pxの高さから始めたいです。フッターには、「詳細」または「概要」というボタン (おそらくリンク) が必要です。ユーザーがクリックすると、フッターの高さが高くなり、代替コンテンツ (「詳細」リンクではなく) を含む、より精巧な div が表示されます。

私は 960 グリッドを利用するサイトに取り組んでいます。サイトの下部には、ページ コンテンツとフッターの間に 100% 幅の画像を含む div があるため、ブラウザーの幅に基づいてサイズが変更されます。ここでデモを確認できます: http://redone.org/_dev/ski/menu2.html

コンテンツが長いため、上記は正常に機能します。ただし、コンテンツが短いページでは、画像とフッターが忍び寄って、フッターとブラウザーの下部の間に不要なスペースが表示されます (上部のナビゲーションで [メニュー 1] をクリックするか、上記のリンクのロゴをクリックします)。ホームページにアクセスしたら、サイズを変更してフッターの下に問題が表示されるようにします。

CSS スティッキー フッター方式 (cssstickyfooterDOTcom) に似た方式を利用したいと考えています。

画像のサイズ変更（これが望ましい）のため、これを解決するのに苦労しています。画像の高さが変わると、jQuery を使用してフッターの高さ/オフセットを更新する必要があると思います。

どんな助けでも大歓迎です。

PS上記のリンクの奇妙さについて申し訳ありません。私はこのフォーラムに不慣れで、問題を視覚的に説明するためのリンクを 1 つしか投稿できず、画像も投稿できません。

フッターのサイズを事前に知らなくても、 CSS を使用してブラウザー画面の下部またはコンテンツの直後 (どちらが長いかによる) にフッターを貼り付ける方法はありますか?

現在、フッターとコンテナーの最小高さが 100% のコンテンツを保持するコンテナーで絶対配置を使用していますが、フッターを変更すると、コンテナーの下部にあるパディングを高さに合わせて変更する必要があることがわかります。 .

人々が私のウェブサイトをナビゲートすると、ページが左右にジャンプします。これは、一部のページに垂直スクロール バーを表示するのに十分なコンテンツがないことが原因です。不必要にページを埋める以外に、この問題の解決策はありますか?

ありがとう

作業中のモバイルサイトのフッターをページの下部に貼り付けたいと思いました。RyanFaitによるCSSStickyFooterの例を見つけて、実装しました。おそらくテストできるすべてのブラウザーで、フッターが下部にうまくくっついていることがわかりました。

そして、それが起こりました。クライアントは、フッターがいたるところに投げ込まれていることに不満を漏らしました。苦労して詳細を要求したところ、問題が発生したのは、BlackBerryモバイルデバイスの1つのモデルである8250モデルのみであることがわかりました。Windows VMを取り出し、BlackBerry 8250シミュレーターをダウンロードしてインストールしましたが、確かに問題が発生しました。

2つのBlackBerry画面の高さのページの場合、フッターは最初の画面の中央、他のすべての上に固定されます。スクロールしてもフッターは移動しません。ページの下半分までスクロールすると、フッターは表示されません。トップ画面の中央に固定されたままです。

この質問の最後にHTMLとCSSを投稿します。なぜこれが8250BlackBerryモデルで起こっているのか、そして特にそれをどのように修正できるのかについての指針や手がかりを得ることができれば、私は非常に感謝しています。

ありがとうございました！

このjQueryStickyFooterハックを見つけました。これが私が一緒に行くべきだと人々が提案するものになるかどうかはあまりわかりません。ただし、まだテストしていません。

更新：これは、すぐ上にリンクされているjQueryStickyFooterハックをいじったという小さな更新です。前述のBlackBerryデバイスでも機能しませんでした。

http://www.cssstickyfooter.com/からスティッキーフッターを何度も実装しました。唯一の問題は、フッターの高さが固定されていることです。内部のコンテンツに基づいてフッターを拡張できる純粋な CSS ソリューションはありますか?

JS ソリューションは悪くありませんが、CSS が最適です。

助けてくれてありがとう。

ねえ、私はボトムスティッキーフッターリンクテストをしようとしていましたが、それは100％以上であり続け、少しスクロールしたことを意味します。

だから私は何も追加せずに単純なHTMLコードを作成しましたが、それでも100％を超えています。ここを参照してください：

問題は、100％より少しだけスクロールし、約5〜10ピクセル多くなることを意味します。これは、IEとFirefoxの両方で本当に奇妙です。

前もって感謝します ！

このウェブサイトのページの下部にフッターを貼り付けようとしています: https://account.radonsystems.net .

残念ながら、私が使用した他の場所では機能していますが、機能していないようです。

スティッキーの CSS は次のとおりです。

底にくっついていない理由を誰かが知っていますか？

これがサイト（Wordpressで作成）です：http：//milabalami.com ページの下部にフッターを貼り付けたいです。私がこれを行う方法の解決策はありますか？私はすでにcssstickyfooter.comとxs4all.nl/~peterned/examples/csslayout1.htmlを試しましたが、どれも私が望むように機能しませんでした。何が起こったのかというと、ページの本体がフッターと重なっているということです。

私はこの2日間、頭を包み込んでいて、イムは負けました。このパズルを解くことができる人はいますか？

私は自分のウェブサイトでこのスティッキー フッターを使用しています: http://www.cssstickyfooter.com/using-sticky-footer-code.html

Firefox、Chrome、IE7 では完全に動作しますが、IE8 では動作しません。IE8 では、スクロールバーは表示されますが機能しません。下に移動する方法が他にありません。Web に表示される条件ステートメントを使用しています。

申し訳ありませんが、アドレスを投稿できません。現在、ウェブでオンラインのサーバーを持っていません。