優れたCycle2jQueryプラグインを使用してレスポンシブ画像ギャラリーを設定しようとしています。ギャラリーには、縦向きと横向きの両方の画像が表示されます。
Centered Slidesオプション(Cycle2のCenterプラグイン:http://jquery.malsup.com/cycle2/demo/center.php)を使用していますが、これがWebkitブラウザーで問題を引き起こしているようです(そうでない場合は、ブラウザーウィンドウのサイズを変更してみてください。最初は明らかです!)
緑の背景はサイクルコンテナを表しています。
センターオプションが追加されていない場合(data-cycle-center-horz = true data-cycle-center-vert = true)、すべてが正常に機能しています。以下を参照してください。
中央バージョンで問題の原因を特定できません。
画像のCSSコードはごくわずかです。
.cycle-slideshow img {
max-height: 100%;
max-width: 100%;
}
含まれている要素のCSSはここにあります
.cycle-slideshow {
background: green;
display: block;
position:absolute;
height:auto;
bottom:0;
top:0;
left:0;
right:0;
margin:20px auto;
padding:0;
width:80%;
}
助けてくれてありがとう!