jquery - Lightbox2画像のサイズ変更

Question

したがって、大きすぎる画像のサイズを変更するには、ライトボックス2に最大画像幅を設定する必要があります。

これを行うために、lightbox.cssファイルを次のように調整しました

#lightbox img {
  max-height:700px;
  max-width:700px;
}

これは画像自体のサイズ変更で機能しますが、白いライトボックスオーバーレイは元の画像ファイルのフルサイズのままなので、画像はライトボックスの途中で失われます。何か案は？私はあなたの助けに感謝します ：-）

Answer 1

1）slimbox2.jsを開く

2）これを書き直します：

    w(h).css({ backgroundImage: "url(" + o + ")", visibility: "hidden", display: "" });
    w(q).width(l.width);
    w([q, I, d]).height(l.height);

に：

if (l.width > $(document).width() - 100) {
        l.height = l.height * ($(document).width() - 100) / l.width;
        l.width = $(document).width() - 100;
    }
    w(h).css({ backgroundImage: "url(" + o + ")", backgroundSize: "" + l.width + "px " +     l.height + "px", visibility: "hidden", display: "" });
    w(q).width(l.width);
    w([q, I, d]).height(l.height);

最大幅は

$(document).width() - 100

Answer 2

これを設定します。

.lb-outerContainer {
    max-width: 720px; 
    max-height: 720px;
}
.lb-dataContainer {
    max-width: 220px; /* For the text below image */
}

Answer 3

CSS に以下を追加してみてください。

.lb-image{
    max-width: inherit;
}