呵呵，大家别见怪啊，这篇文章可不是和这两个标签 说BYE-BYE 而是，进一步的 运用这两个标签。
好了，我们这节课一开始，第一个例子，用JS控制 这两个标签，哦，对了，我之讲解一个了，这两个哥们的功能太像了，其他的大伙自己去理解吧。
XML/HTML Code复制内容到剪贴板
- <! DOCTYPE HTML>
- <html>
- <head>
- <script type="text/javascript">
- function Show() {
- var video = document.createElement('video');
- video.src = 'c:/text/1.mp4';
- video.controls = true;
- document.body.appendChild(video);
- }
- </script>
- </head>
- <body>
- <input type="button" value="显示视频" onclick="Show();"/>
- <body>
- </html>
这个就是我们用脚本去创建一个 video 对象了，呵呵。
好了，我们当然也可以这么着写的
XML/HTML Code复制内容到剪贴板
- <! doctype html>
- <html>
- <body>
- <video controls="true" width="320" height="240">不支持这个标签</video>
- <input type="button" value="加载视频" onclick="document.getElementsByTagName('video')[0].src='c:/text/1.mp4'"/>
- <body>
- </html>
好了，呵呵，这个是不是可以写成，动态加载自己的视频文件呢？
HTML5开发的代码的 格式更加的 多样化，你可以
用下面的三种格式去 写HTML5的代码。
XML/HTML Code复制内容到剪贴板
- <video loop>
- <video loop="">
- <video loop="loop">
上面的三种代码都是正确的。
当然，你也可以自己给video 标签，写出来自己的 开始和结束
XML/HTML Code复制内容到剪贴板
- <! doctype html>
- <html>
- <head>
- </head>
- <body>
- <video controls="true" width="320" height="240">不支持这个标签</video>
- <input type="button" value="加载视频" onclick="document.getElementsByTagName('video')[0].src='c:/text/1.mp4'"/>
- <input type="button" value="播放" onclick="document.getElementsByTagName('video')[0].play()" />
- <input type="button" value="暂停" onclick="document.getElementsByTagName('video')[0].pause()" />
- <body>
- </html>
当然你也可以做一个滚动条效果。【自己的滚动条哦】
XML/HTML Code复制内容到剪贴板
- <input type="range" step="any" id="seekbar"/>
在这里，我就不给大家实现了，就是 运用 JS 来控制的。
我们也可以实现 快放 和 慢放。
下面，我给大家慢慢的说一些 我在做 HTML5的实例时间的 觉得很好的东西
首先
XML/HTML Code复制内容到剪贴板
- <button class="play" title="play"></button/>
然后是
XML/HTML Code复制内容到剪贴板
- <button class="play" title="play"></button/>
哈哈。欢迎大家 和我交流 这两个标签的用法，再见啦。
相关文章
精彩导读
热门资讯
关注我们
