そもそも”Easy” Fancy Boxなのよね。 The lightbox is resizing according to your screen size and the image ratio.ということです。縦長の画像だけHeight auto falseにできないから横幅の最大値をデバイス毎に変えてあげればできるかも？いじるとすればCSSの下あたりいじるんだろうけど。海外のフォーラムから拾ってきたから数値は適当です。
#fancybox-content {border-width:0px !important; height:620px !important; width:auto !important; min-width:500px; margin-top:-20px !important;} #fancybox-img {width: auto !important; height: auto !important; max-height:620px;}
5 件の回答
技術的には、設定されてるmax-heightと、overflowの挙動を変えればできそうだけど、
推測される主の知識だと、他のプラグインを人気順に試していくってのが最短ルートな気がする。
画像が縦長のものだけ個別にcssで修正ですかね？全部同じ設定でうまくいくcssの書き方があればいいのですが…
やりたいことがよく分からないですが、スクリーンの横幅100%に画像を拡大表示させたいんですか？
めちゃくちゃ見づらいと思うんですが。。。
Re:4
いえ。
上記プラグインを使って、画像が元のサイズのまま縮小されずに表示されるようにしたいです。
現状は、縦長の画像だとディスプレイの縦サイズが上限となり、元の画像より小さく表示されてしまいます。
そもそも”Easy” Fancy Boxなのよね。
The lightbox is resizing according to your screen size and the image ratio.ということです。縦長の画像だけHeight auto falseにできないから横幅の最大値をデバイス毎に変えてあげればできるかも？いじるとすればCSSの下あたりいじるんだろうけど。海外のフォーラムから拾ってきたから数値は適当です。
#fancybox-content {border-width:0px !important; height:620px !important; width:auto !important; min-width:500px; margin-top:-20px !important;}
#fancybox-img {width: auto !important; height: auto !important; max-height:620px;}
間違えていたらどなたかご指摘願います。