Home > front end >  Can't help onloadeddata trigger on the mobile end
Can't help onloadeddata trigger on the mobile end

Time:09-16



Set the cover video to video the first frame & lt;/title> <br/><style> <br/>The video {<br/>Width: 500 px; <br/>height:300px; <br/>} <br/></style> <br/></head> <br/><body> <br/><! --<Video SRC="https://bbs.csdn.net/topics/img/ce.mp4" onl oadeddata="HTTP://https://bbs.csdn.net/topics/showFrame (event)" controls "controls" calss=="video" & gt; <br/></video> - & gt; <br/><br/><Video onl oadeddata="https://bbs.csdn.net/topics/showFrame (event)" SRC="https://bbs.csdn.net/topics/img/ce.mp4" its - playsinline="true" x - its - airplay="true" playsinline="true" x5 - video - player - type="h5 x5 - video -" orientation "=" h5 preload "=" auto "width=" 420 "height=" 280 "controls" controls "calss==" video "& gt; <br/><The source of the SRC="https://bbs.csdn.net/topics/img/tuyu2.mp4" type="video/mp4 & gt;" <br/></video> <br/><Img SRC="" id=" img "& gt; <br/><script> <br/>The function showFrame (event) {<br/>Let scale=0.8, video=event. The target, <br/>Canvas=document. The createElement method (" canvas ");//create a canvas <br/>Canvas. Width=video. VideoWidth * scale; <br/>Canvas. Height=video. VideoHeight * scale; <br/>Canvas. GetContext (' 2 d) drawImage (video, 0, 0, canvas, width, canvas, height); <br/>Try {<br/>The console. The log (canvas. ToDataURL (" image/PNG ")) <br/>Document. The getElementById (" img "). src=https://bbs.csdn.net/topics/canvas.toDataURL (" image/PNG "); <br/>Video. SetAttribute (" poster, "canvas. ToDataURL (" image/PNG")); <br/>} <br/>The catch (err) {<br/>The console. The log (" Error: "+ err); <br/>} <br/>} <br/></script> <br/></body> <br/></html> <br/><br/>This has no effect on the mobile end, cover can be generated on a computer, mobile phone not <br/> </div> <div class="th_page th_page_color"></div> <div class="umCopyright"> <p>Page link:<a href="/frontend/4230.html" target="_blank" style="color:#999">https//www.codepudding.com/frontend/4230.html</a></p> </div> <div class="detail-arr"> <div class="detail-arr-left">Prev:<a href='/frontend/4229.html'>Could you tell me how to array to object the react</a></div> <div class="detail-arr-right">Next:<a href='/frontend/4231.html'>Pen boring novel download</a></div> </div> </div> </div> </div> </div> <div class="container th_top"> <div class="row"> <div class="col-md-12"> <div class="hot-tags neitags"> <ul> <li><i class="iconfont icon-x-tags"></i> Tags:  </li> <a href='/e/tags/?tagname=JavaScript' target='_blank'>JavaScript</a> </ul> </div> </div> </div> </div> <div class="container th_top"> <div class="row"> <div class="col-md-12"> <div class="xiangguan"> <ul class="msg msghead"> <li class="tbname">Related</li> </ul> <ul> </ul> </div> </div> </div> </div> <div class="container th_top"> <div class="row"> <div class="col-md-12"> <div class="flinks"> <ul> <li><i class="iconfont icon-x-tags"></i> Links:  </li> <li class="liflinks"><a target="_blank" href="/" title="CodePudding">CodePudding</a></li> </ul> </div> </div> </div> </div> <div class="footer"> <p><span style="font-size:16px;color:#666;font-weight: bold">About Us:</span>  <a href="https://www.codepudding.com/contact.html">Contact Us</a>      <a href="https://www.codepudding.com/service.html">Terms of Service</a>      <a href="https://www.codepudding.com/privacy.html"> Privacy Policy</a></p> <p class="foot_info">Copyright © 2010-2023,Powered By <a href="/" target="_blank">CodePudding</a> </p> </div> <script type="text/javascript" src="/skin/code/tianhu.js"></script> </body></html>