ブログ

Swiper 文字サイズ問題について

PCやブラウザのデベロッパーツールで確認したときにはうまく出来てるのに、実機(iPhone)で見ると文字サイズが変わってしまう!!

スライダー・カルーセルとしておなじみの

Swiper

いろんなオプションもありレスポンシブにも対応しているので、使用頻度は高めです。

うまくスライドしない!

とか

違う違うそうじゃそうじゃない!

とか

そんなことはよくあること。

自分の理解不足を嘆きながら頑張って解決するしかないのですが、

今回の問題はすっかりお手上げだった。

iphoneとMacを繋いでデベロッパーツールで確認しても、どこの指定が効いて文字サイズが変わっているのかわかりませんでした。

いろいろ検索してみて解決法を見つけました!

ありがとうGoogle先生!!

解決法

body {
 -webkit-text-size-adjust: 100%;
}

たった1行cssに追加するだけ!

text-size-adjustプロパティはデバイスに合わせてテキストサイズを調整する機能をなかったことにする、的なプロパティです。(解釈には個人差がありますw)