前提・実現したいこと
bgSwitcherを使用してメインビジュアル画像をスライドさせているのですが、
スマホだと画像が拡大表示されてしまい、直し方が分からなくて困っています。
PCでは問題なく表示されます。
ディスプレイサイズで画像の切り替えができたら、と考えましたが、
もしそれ以外にも方法があれば教えていただきたいです。
HTMLに<script>で記入しています。
該当cssも一応掲載します。
発生している問題・エラーメッセージ
.bg-slider {
width: 100%;
height: 100vh;
background-position: 60% top;
background-size: cover;
background-attachment: fixed;
background-repeat: no-repeat;
display: flex;
align-items: center;
justify-content: center;
position: relative;
}
該当のソースコード
<script> jQuery(function($) { $('.bg-slider').bgSwitcher({ images: ['images/main1.jpg','images/main3.jpg','images/main2.jpg','images/main4.jpg'], // interval: 5000, loop: true, shuffle: false, effect: "fade", duration: 500, easing: "swing" }); }); </script>試したこと
background-size、widthなどcssは一通り弄りました。
だめでした。
補足情報(FW/ツールのバージョンなど)
ここにより詳細な情報を記載してください。
あなたの回答
tips
プレビュー