點選圖片,播放視訊
阿新 • • 發佈:2018-11-29
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="author" content=""> <title>study</title> <style type="text/css"> *{margin: 0;padding:0;} .index-vedio{width: 830px;height: 460px;margin: 50px auto;} .index-vedio img{width: 100%;height: 100%;} </style> </head> <body> <div class="index-vedio"><img src="./conter1.jpg"></div> <script> //視訊播放 var indexVedio = document.querySelector(".index-vedio"); indexVedio.onclick = function(){ indexVedio.innerHTML = "<iframe width=100% height='460' src='https://www.youtube.com/embed/aeyuLu9t0YE?rel=0&autoplay=1' frameborder='0' allow='autoplay; encrypted-media' allowfullscreen></iframe>"; } </script> </body> </html>