slickスライダーを使用しているとスマホでピンチイン（拡大）出来なくて困ることがあります。
以下のサンプルはピンチイン出来ないままの状態です。
次のサンプルはスマホで拡大出来るので、指でピンチインしてみてください。
原因と対処方法
原因はslickスライダー標準のCSSの影響です。touch-action: pan-y;というスタイルシートの指定のためにピンチイン出来なくなってしまっています。
CSSファイルの操作が出来る場合
なのでCSSファイルをダウンロードしている場合は、下記の箇所を削除するかコメントアウトすればピンチイン・ピンチアウトが出来るようになります。
.slick-slider
{
position: relative;
display: block;
box-sizing: border-box;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-touch-callout: none;
-khtml-user-select: none;
/* -ms-touch-action: pan-y;
touch-action: pan-y; */ /* ←ここの部分 */
-webkit-tap-highlight-color: transparent;
}CSSをCDNで読み込んでいる場合
しかし、CSSをCDNで読み込んでいると削除もコメントアウトも出来ませんよね……その場合は追加でCSSを記述します。
.slick-slider {
-ms-touch-action: auto;
touch-action: auto;
}スライダーのクラス名をカスタムしていない限りは.slick-sliderのクラス指定で問題ありません。
ちなみにSwiper.jsは……
…
特に何もしなくてもでデフォルトで拡大縮小出来ますね！
