WEB広告運用の困りごとが集まる場所 › コミュニティ › コミュニティ › アンケート回答後の挙動を変更したい › 返信先:アンケート回答後の挙動を変更したい
-
お待たせいたしました🙌
修正方法を案内させていただきます!
①「回答を完了する」ボタンを追加
HTMLの116行目「<p class=”quiz_cont_progress”><span>4</span>/4</p>」の後に下記記述を追加
<div class="wrap-btn-forword"><button onclick="quizResultNotChange.questionFoward(this)" class="btn-forword js-btn-forword" type="button">回答を完了する</button></div>
https://t.gyazo.com/teams/squadbeyond/dcda4be18184b88a56b0245767959a69.png
②回答後のコンテンツを隠せるように移動する
HTMLの117行目から125行目の記述を削除
https://t.gyazo.com/teams/squadbeyond/89bd73a28d44b996497bcd70a59843de.png
121行目「 <div class=”quiz_result is-hidden” id=””></div>」の間に下記記述を追加
<p class="quiz_cont_image"><video allowfullscreen="true" autoplay="true" controlslist="nodownload" loop="true" muted="true" name="media" playsinline="" class="lazyload">
<source type="video/mp4" src="https://file.mysquadbeyond.com/uploads/article_photo/photo/3041519/a72da37f-8983-46b4-906b-ef64949da34b.mp4">
</video></p>
<br>
<div class="downArrow movebtn"><span></span><span></span><span></span></div>
<div class="btn-area"><!--下記ooooo部分にリンク先URLを置いてください。もしくは左の表示されているボタンテキストを選択した後に上部のリンクボタンから追加可能--><a href="https://tsugitsugi-m.com/register?sb_tracking=true">
<font face="sans-serif">かんたん無料登録で<br>ホテルをみてみる</font>
</a></div>
https://t.gyazo.com/teams/squadbeyond/a27b8de23550333ff638220dff663d4a.png
③CSSの調節を行う
421行目を削除
変更前
.quiz_result {
padding: 0 10px;
display: flex;
width: auto;
justify-content: center;
position: relative;
}
変更後
.quiz_result {
padding: 0 10px;
width: auto;
justify-content: center;
position: relative;
}
下記記述を一番下に追加
.video-container { position: relative; width: 513px; /* ビデオの幅に合わせる */ height: 578px; /* ビデオの高さに合わせる */ } video { width: 100%; height: 100%; object-fit: cover; /* アスペクト比を保ちながらコンテナに収める */ }