前提・実現したいこと
jQueryの「Lity」を使用して、
画像をクリックしたら自作のmp4動画をポップアップ、自動再生したいと思っております。
自分で組んだコードでは、ポップアップ後の自動再生の再生位置がバラバラになってしまいます。
※初回の再生も中途半端な位置から再生されます。再生位置は毎回違って規則性はないように思います。
同じコードをサイト内の色々なページで使用して、どこでも最初から見れるようにしたいです。
毎回ポップアップ後の動画を始めから再生するには、どのように処理すれば良いかご教授頂けますと幸いです。
#ソースコード(HTML)
lang
1 2<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 3<link rel='stylesheet' href='https://cdnjs.cloudflare.com/ajax/libs/lity/1.6.6/lity.css' /> 4<script src='https://cdnjs.cloudflare.com/ajax/libs/lity/1.6.6/lity.js'></script> 5 6 7<a href='#popup' data-lity="data-lity"> <img src='(画像のurl)aaa.PNG' width='200' height='auto' title="aaa動画"/></a> 8 9<div id='popup' class="lity-hide"> 10<video autoplay="true" controls="controls" controlslist="nodownload" height="600" id="video201961115307" poster="" width="800"><source src="(動画のurl)aaa.mp4" autoplay />Your browser doesn't support video.<br /> 11Please download the file: <a href="(動画のurl)aaa.mp4">video/mp4</a></video> 12</div> 13
試したこと
※コード内の「autoplay="true"」を「autoplay="false"」にした場合も同じでした。
ここにより詳細な情報を記載してください。
動画は自身が所持している動画でしょうか。
あと細かいですが「jQuery」です。
ご返信ありがとうございます。
動画は自身で所持しているものです。
仕事に関わるものなので、公開ができないのですが・・・
>>あと細かいですが「jQuery」です。
ご指摘ありがとうございます。修正いたしました。
すみません。タイトルも調整願います。(タグにあるのでタイトルに書かなくても良いとは思いますが)
あとコードはマークダウンのcode機能を利用してご提示ください。
https://teratail.com/help#about-markdown
>マークダウンのcode機能
難しければコード部分を選択し<code>ボタンを押すだけで良いですよ。
何が大事かってこれで行頭のインデントがきちんと反映されたり、ワンクリックでコピペできるようになるので、回答するために正しく再現確認ができるようになります。
すべてが初心者で申し訳ありません。。。
教えていただきありがとうございます!
回答1件
あなたの回答
tips
プレビュー