1

フルスクリーンの背景スライドショーを表示するために、超大型のjqueryプラグインを使用しています。このウェブサイトを見てください（それは私自身のものではありませんが、私は同じ構造を使用しています）：

http://mysampleconcept.com/situs4/

ご覧のとおり（たとえば、ヘッダーに不透明度を設定した場合）、画像は体の上部から始まります。ただし、ヘッダーの下から開始する必要があります（ヘッダーが画像の上部を覆わないようにするため）。

たとえば、超大型のLIを指定すると、top：100px; 画像全体が下に移動し、画像の下部がフッターの下に表示されなくなります。だから、それは私が望む解決策ではありません。

ですから、私が必要としているのは、ウィンドウの内側にありながら、上100pxにも下にも伸びないように、可能な限り最大のサイズに引き伸ばす画像です。

これどうやってするの？

申し訳ありませんが、私の英語は最高ではありません...

私はこの解決策を見つけましたが、それを実装する方法がわかりません：https ://stackoverflow.com/a/12889088/1981981

4

1 に答える 1

1

あなたが参照した質問で提供された解決策を出発点として使用できます。ドキュメント準備完了関数内の $.supersized() のすぐ下に配置するだけです。上部のオフセットが必要なので、上部の値も変更する必要があります。あなたのニーズに合わせて切り取ったものを修正しました：

var portfolioSize = function() {
  var headerOffset = 100;
  $('#supersized').css({ 
    height: $(window).height() - headerOffset,
    top: headerOffset + 'px'
  }); 
};
portfolioSize();
$(window).resize(function() { portfolioSize(); });

$(window).load イベントを直接呼び出しに変更しました。これは、ドキュメント準備完了関数内にコードを配置したためです。

他の回答 ( https://stackoverflow.com/a/12889088/860205 )に記載されているように、配置のために CSS を変更することを忘れないでください。

于 2013-02-21T12:12:21.167 に答える