サイトの親コンテナ(全身ではない)で画像を垂直方向に引き伸ばそうとしています。これは、IDが「imagen-fondo」のdivです。
私はbackstretchプラグインと、background-sizeを使用したcssbackground-imageのいずれかを試しました。
ただし、どちらの場合も問題は、親コンテナの計算された高さが直接の子の高さよりも小さいため、背景画像がコンテンツ自体よりも小さく見えることです。
どうすれば彼の直接の子供と同じ高さ、または少なくともそれより大きくすることができますか?
ここでライブデモを見ることができます:
http://50.21.181.12:3001/plantillas/mba
アップデート:
問題は、div#imagen-fondoがコンテンツではなくウィンドウの高さを取得していることだと思います。これが、画面が大きい場合は問題が発生しないが、ウィンドウの高さが発生するコンテンツよりも小さい場合は、背景画像が終了する垂直方向のスクロールを開始するのと同じように、この2つのスクリーンショットで確認できます。
オーバーフローのあるものはありますか?
更新2:
今のところ、私はそれを機能させるためにいくつかのJavaScriptを導入しました、
フッターのオフセット位置を取得し、「。backstretch」divの高さをその高さまでストレッチします。
ただし、ウィンドウのサイズを変更して垂直スクロールバーを表示し、ページを調べると、親コンテナ「#imagen-fondo」(バックストレッチが自動的に高さを取得する場所)が引き続き高さを取得していることがわかります。コンテンツ自体からではなく、表示されるビューポート。
誰かがそれを行うためのより良い方法を見つけた場合、CSSはこの汚いアプローチの代わりにそのアプローチのみを使用します。