html5的 video标签 - ITeye问答

问答首页 → Web前端技术

0 0

html5的 video标签3

自己用html5 的标签写了一个视频播放的页面，我想用js来控制播放停止循环播放
    <video id="example" height="256" width="592" controls="true" autobuffer="true">
                <source src="video/demo1.webm" type="video/webm" />
                <p>您的浏览器不支持HTML5 video 标签</p>
    </video>
    <input type="button" value="播放" id="play">
    <input type="button" value="停止" id="stop">
    <input type="button" value="循环播放" id="looping">

    点播放的时候我想给video标签增加了自动播放的属性，可是没有自动播放，怎么回事啊？
    jQuery(function(){
jQuery('#play').click(function(){
      jQuery("#example").attr('autoplay','true');
});
});
    怎么通过js来控制这个视频的播放情况啊？

HTML5 Web综合

2011年1月04日 10:05

fanlin861105
0
0 0 0

2个答案按时间排序按投票排序

0 0

采纳的答案

jQuery(function(){ 
	jQuery('#play').click(function(){ 
	      var video = jQuery("#example")[0];
	      if (video.paused) {
		video.play();
	      }
	}); 
	jQuery('#stop').click(function(){ 
	      var video = jQuery("#example")[0];
	      if (!video.paused) {
		video.pause(); // 暂停
	      }
	}); 
});

2011年1月04日 10:57

langshao
938
0 0 0

添加评论

0 0

autoplay属性应该是加载完成之后，才能自动播放。
你的视频文件还没有加载完成，应该不能自动播放

2011年1月04日 10:52

明天的昨天
162
0 0 0

添加评论

相关推荐

HTML5 video 标签浏览器兼容问题: HTML5的`<video>`标签是现代网页中用于嵌入视频内容的重要元素，它使得开发者无需依赖第三方插件即可在网页上展示视频。然而，由于不同的浏览器可能支持不同的编码格式和特性，`<video>`标签的兼容性问题一直是前端...

Html5video标签访问网络摄像机实时监控.pdf: Html5视频标签访问网络摄像机实时监控 Html5视频标签访问网络摄像机实时监控主要涉及到以下几个知识点： 1、Html5视频标签：Html5中引入了视频标签，可以直接播放视频，不需要安装插件。但是，Html5视频标签不支持...

html5video标签用法: `<video>`标签是HTML5的核心元素，允许开发者在网页中嵌入视频内容。下面将详细阐述其基本使用方法、属性、事件和样式控制。 1. **基本结构**： `<video>`标签的基本结构如下： ```html <video src="your_video....

H5的video标签跨域.HTML的video标签跨域_跨域ajax: H5的video标签跨域.HTML的video标签跨域我们都知道HTML video标签能播放视频但是如果你的video要播放的是非当前域名下的视频文件,这就要跨域播放视频, 应该如何实现呢?

HTML5 Video标签的属性、方法和事件汇总介绍: Media方法和属性： HTMLVideoElement和HTMLAudioElement 均继承自HTMLMediaElement Media.error; //null:正常 Media.error.code; //1.用户终止 2.网络错误 3....<strong>//网络状态</strong> - Media.currentSrc;...

transform实现HTML5 video标签视频比例拉伸实例详解: 首先，作者提到了使用CSS的object-fit属性，尤其是fill值，作为直接调整video标签中视频尺寸的方法。object-fit属性在CSS中用来指定可替换元素（如img或video）的内容应该如何填充其框的大小。使用fill值可以让视频...

HTML5 video how to下载: 1. HTML5 video标签的使用：video标签是HTML5中用于在网页上嵌入视频内容的标准标签。它提供了一个简单的API用于播放视频，包括常用的功能如播放、暂停、调整音量等。一个基本的video标签使用示例如下： ```html ...

h5 video统一播放: 在给定的压缩包中，`HTML5 video标签测试.html`很可能是包含`<video>`标签示例的HTML文件，`HTML5 video标签测试_files`可能包含与该HTML文件相关的资源，如CSS样式或JavaScript脚本，`cat.mp4`则是一个具体的视频...

HTML5视频播放video标签使用方法.docx: HTML5的`<video>`标签是现代网页设计中用于内嵌视频内容的关键元素，它使得开发者无需依赖外部插件即可在网页上展示多媒体资源。在本文中，我们将深入探讨`<video>`标签的使用方法，以及如何通过JavaScript进行交互...

CKEditor 添加Video插件(MP4)并且兼容HTML5 Video插件,完美运行: 3. **MP4支持**：HTML5 Video标签支持多种视频格式，包括MP4、WebM和Ogg。由于MP4在大多数浏览器中都有良好的兼容性，我们将主要关注这一格式。在CKEditor中插入视频时，需要确保视频文件是MP4格式。同时，你需要在...

一个移动端H5Video标签播放视频的实现: 您的浏览器不支持video标签。 </video> ``` - `src`属性：指定视频文件的URL。 - `controls`属性：显示默认的控制条，包括播放/暂停按钮、进度条等。 - `poster`属性：设置视频加载前显示的预览图片。二、移动端...

cefsharp57支持video标签: 4. **使用video标签**：在HTML代码中，通过`<video>`标签插入视频。例如： ```html <video width="320" height="240" controls> <source src="myVideo.mp4" type="video/mp4"> Your browser does not support ...

H5 Video标签调用摄像头进行录像，兼容苹果、安卓系统、可在微信浏览器正常使用: 总结，实现H5 Video标签调用摄像头录像并兼容苹果、安卓系统以及微信浏览器，主要涉及HTML5 `<video>`标签、MediaStream Recording API、JavaScript编程以及微信JS-SDK的使用。通过这些技术，我们可以创建出一个跨...

解决！html中使用video标签调用本地视频结果只有音频没有视频画面: 在HTML中，`<video>`标签是用于嵌入和播放多媒体内容的重要元素，特别是视频文件。然而，有时候可能会遇到一个问题，即使用`<video>`标签加载本地视频时，只有音频可以播放，但视频画面无法正常显示。这种情况可能是...

HTML5 video标签（播放器）学习笔记（一）:使用入门: HTML5的`<video>`标签是现代网页开发中的一个重要元素，它允许开发者在网页上嵌入视频内容，无需依赖Flash或其他第三方插件。这篇学习笔记主要介绍了`<video>`标签的基本使用，包括如何初始化视频播放器，设置视频源...

自定义美化HTML5 video视频播放器界面样式: 在网页设计中，HTML5 的 `<video>` 标签是一个重要的元素，它使得开发者可以直接在网页上嵌入视频内容，而无需依赖Flash等外部插件。本教程将深入探讨如何自定义美化HTML5 `video` 视频播放器的界面样式，以创建一个...

HTML5标签video官方文档: HTML5的`<video>`元素是现代网页设计中不可或缺的一部分，它允许开发者在网页上嵌入视频内容。这个元素的官方文档提供了详细的信息，包括它的类别、可用性、内容模型以及一系列的属性和接口。首先，`<video>`元素...

video.js实现鼠标移入播放鼠标移出暂停: video.js是一个强大的HTML5视频播放器，它提供了丰富的自定义选项和良好的浏览器兼容性，使得开发者能够轻松地创建具有高级特性的视频播放体验。首先，我们需要确保已经在项目中引入了video.js的基本库和样式文件...

Ask-but

我的问答 FAQ | 勋章

相关推荐

已解决问题

未解决问题

排行榜

查看全部排名>>

Global site tag (gtag.js) - Google Analytics