問題タブ [flickity]

Javascript でのメディア クエリの使用に関する w3schools チュートリアルを調べてきましたが、モバイル ブラウザーでオーバーレイをページ全体にスライドさせるのに問題があります。

デスクトップ ブラウザでは、トランスフォーム アイコンをクリックすると、オーバーレイ スライドが 50% 離れます。

この例を使用する Javascript を使用したメディア クエリ

追加したい新機能はこちら。

上記の関数をスニペットにリストされている既存の関数に追加すると、オーバーレイは既に表示されており、ビューポートが 400px 以下の場合、完全にスライドしません。

また、オーバーレイをクリックするとスライダーの矢印が非表示になるようにしたいと思います。矢印のクラス名は

参照用に、新しい関数がない場合のスニペットを次に示します。

新しい関数を追加したときの外観のスニペットを次に示します。<meta name="viewport" content="width=device-width">あなたの提案に従って head タグに行を追加しましたが、結果は同じです - オーバーレイはページの 50% しかスライドしません。