怎么在html 通过点击按钮在同一页面相同位置切换视频?弄了一天了,希望有懂的朋友解答一下。
1条回答 默认 最新
- coder2038 2023-05-28 15:25关注
怎么在html 通过点击按钮在同一页面相同位置切换视频?弄了一天了,希望有懂的朋友解答一下。
```javascript <!DOCTYPE html> <html> <head> <title>切换视频示例</title> </head> <body> <h1>切换视频示例</h1> <!-- 第一个视频 --> <video id="video1" width="640" height="360" controls> <source src="video1.mp4" type="video/mp4"> Your browser does not support the video tag. </video> <!-- 第二个视频 --> <video id="video2" width="640" height="360" style="display:none" controls> <source src="video2.mp4" type="video/mp4"> Your browser does not support the video tag. </video> <!-- 切换视频的按钮 --> <button onclick="toggleVideo()">切换视频</button> <script type="text/javascript"> var video1 = document.getElementById("video1"); var video2 = document.getElementById("video2"); function toggleVideo() { if (video1.style.display === "none") { video1.style.display = "block"; video2.style.display = "none"; } else { video1.style.display = "none"; video2.style.display = "block"; } } </script> </body> </html>
```
解决 无用评论 打赏 举报
悬赏问题
- ¥15 这个如何解决详细步骤
- ¥15 在微信h5支付申请中,别人给钱就能用我的软件,这个的所属行业是啥?
- ¥30 靶向捕获探针设计软件包
- ¥15 react-diff-viewer组件,如何解决数据量过大卡顿问题
- ¥20 遥感植被物候指数空间分布图制作
- ¥15 安装了xlrd库但是import不了…
- ¥20 Github上传代码没有contribution和activity记录
- ¥20 SNETCracker
- ¥15 数学建模大赛交通流量控制
- ¥15 为什么我安装了open3d但是在调用的时候没有报错但是什么都没有发生呢