-
Widget部分に到達した瞬間に紙吹雪を展開させたい
トピックス by
1792 pt
2023年9月15日 11:05
467
PV
【Widget名】
紙吹雪・爆発(スクロールで展開)
【修正したいこと】
Widget部分に到達した瞬間に紙吹雪を展開するような仕様へご変更いただきたいです。
-
7 コメント
-
既に指定部分に到達した瞬間に紙吹雪を展開する仕様になっております！
プレビュー：
詳細設定に関してご不明点がありましたら、どうぞお気軽にご質問くださいませ。
-
お世話になっております。
当ウィジェット挿入部上下に他ウィジェットや画像等が入っており、紙吹雪のウィジェットは２行程度に縮めているのですが、この際にページを確認するとエフェクトが展開されない次第です。これはウィジェットの長さの問題なのでしょうか。
ご教示のほど、よろしくお願いいたします。
-
1 年, 2 月前
bebebebeyondが変更
-
ご相談ありがとうございます！
紙吹雪自体が確認できないということでしょうか？
Widgetの長さは関係なさそうです！
該当のbeyondページのURLをご共有いただけますか？
また、どこの箇所で紙吹雪をさせたいのかも一緒にお願いします！
-
ご返信ありがとうございます。
左様でございます、紙吹雪自体が出現しておりません。
https://app.squadbeyond.com/ab_tests/KqfVByDtsznCBfAH-w/articles
こちらのページの「このページ限定」バナー下部の２行の文言に紙吹雪ウィジェットを利用しております。
お手数お掛けいたしますが、よろしくお願いいたします。
-
URLを共有いただきありがとうございます！確認させていただきました！
紙吹雪の発生地点の指定としてjs-scroll-point というclassが必要になります。そのため、テキストを囲う<div> の<div class=”js-scroll-point”> への変更をお願いします。
<!-- 以下がHTMLになります
紙吹雪が現れる位置の要素に、クラスjs-scroll-pointをつけてください -->
<div class="confetti_explosion">
<div>
<div style="text-align: center;">ここまで読んでくれた<strong style="color: rgb(255, 82, 82);">お礼</strong>に、</div>
<div style="text-align: center;">
<strong>このページ限定</strong>の</div>
</div>
</div> -
ありがとうございました！無事解決いたしました！
-
よかったです！
またなにかありましたらご相談ください💫
-
1 年, 2 月前
