【LEEEP】スマホ表示で横スクロールをなくしたい

LEEEPを初めてネットショップで使いました。
コードを貼るだけで簡単設置できるので便利ですね。

LEEEP

LEEEP|ECサイトに動画・UGCを掲載するならLEEEP(リープ)
LEEEPはECサイトの売上アップを支援するための様々な機能を提供します。Instagram連携によるUGC活用機能、動画コマース機能、スタッフ・インフルエンサーなどの投稿を活用するクリエイターズ機能、レビュー機能など。

インスタの投稿を自動更新してくれる!助かります!

ただお客さんからの要望で表示の手直しを要望されました。

基本は投稿をクリックした時、PCだとポップアップを1投稿ごとに表示、スマホだとポップアップ状態から次の投稿へ横スクロールで移動することが可能です。

そのスマホの横スクロールを取り止めて欲しい、とのこと。

私などは手軽に見れて便利だと思うんですけどね。
インスタ投稿ばっかり見て飽きて離脱しちゃうから? それとも横スクロールというの自体が鬱陶しいんでしょうか?

ともあれ要望なのでカスタムCSSで修正しました。

@media (max-width: 768px) {
#LeeepPopupScrollX {
touch-action: pan-y; 
overscroll-behavior-x: none;
-webkit-overflow-scrolling: auto;
}
}

これで横スクロールはなくなった・・・はず?

ただこれだけだと左右にちらっと見える前後の投稿が気になるんですよね。
これで横スクロールできないのは詐欺になっちゃう。それに元のページに戻る時に×印かポップアップの外をクリックするしかないんでそのスペースも確保したい。

@media (max-width: 768px) {
#LeeepPopupScrollX {
touch-action: pan-y;
overscroll-behavior-x: none;
-webkit-overflow-scrolling: auto;
left: max(12px, 4vw) !important;
right: max(12px, 4vw) !important;
}
}

た・・・たぶん、大丈夫??
かなり怪しいですけど(^-^;

この表示変更はともかくLEEEPさんには戻るボタンでもポップアップを消せるようにしてほしいなぁ。
他のサイトやアプリでもよくやるんですが、前の表示に戻りたい時に無意識に戻るボタンを押しちゃうんですよね。
するとアプリ終了だったり、ショップを開く前のページまで戻ったりしちゃうっていう。
あれ、めっちゃストレスで嫌いなんです(>_<)

横道にそれましたが、LEEEP改良編でした!

タイトルとURLをコピーしました