html5-video

HTML5 Video autoplay not working

廉价感情. 提交于 2020-03-21 11:21:33
问题 I have been looking into how to implement HTML5 videos as a background video on web and mobile, below is the following code- it displays but not autostarts, this is the problem <video width="100%" controls autoplay> <source src="video/342125205.mp4" type="video/mp4"> <source src="video/342125205.ogg" type="video/ogg"> </video> 回答1: Depending on your Chrome version you might get the new implementation of video autoplay rules: Muted autoplay is always allowed. Autoplay with sound is allowed if:

HTML5 Video Javascript

徘徊边缘 提交于 2020-03-21 10:32:07
问题 I am not experienced in Javascript, I have the following script to play video files on Andriod phone, and it works fine. <script type="text/javascript"> function PlayMyVideo(arg) { var myVideo = document.getElementById([arg]); myVideo.play(); } </script> <video id="what" src="what.mp4" poster="" /> <input type="button" onclick="PlayMyVideo('what')" value="Play" /> I am trying to write the tag on the fly: <script type="text/javascript"> function PlayVideo() { new_video = document.createElement

Highlight player seekbar in HTML5 video

社会主义新天地 提交于 2020-03-20 05:58:05
问题 I have a customized seekbar for my HTML5 video player. But I need to highlight some predefined portions of the seekbar, say seconds 2-5 and 7-8 . How can I do that? Basically, I need it to be something like this: Here is my simple code so far: <!DOCTYPE html> <html> <head> <style> .body{ background-color:black; } .video-player { position: relative; width: 66%; height: 66%; } .video-player img { width: 100%; height: 100%; } .video-player video { position: fixed; top: 0; left: 0; min-width: 66%

Highlight player seekbar in HTML5 video

久未见 提交于 2020-03-20 05:57:29
问题 I have a customized seekbar for my HTML5 video player. But I need to highlight some predefined portions of the seekbar, say seconds 2-5 and 7-8 . How can I do that? Basically, I need it to be something like this: Here is my simple code so far: <!DOCTYPE html> <html> <head> <style> .body{ background-color:black; } .video-player { position: relative; width: 66%; height: 66%; } .video-player img { width: 100%; height: 100%; } .video-player video { position: fixed; top: 0; left: 0; min-width: 66%

HTML5 Video: get seek-from position

徘徊边缘 提交于 2020-02-24 09:37:25
问题 I want to keep track of the seeks performed in an HTML5 video. For this, I need to know the seek-from and seek-to positions. While getting the second is trivial (one only has to listen to the seeked event), I am unable to figure how to get the first. In the past, I've used custom controls , so I could save currentTime just before manually changing it to perform the seek, when listening to the mousedown event of the progress bar or whatever I had rendered. Now, I wanted to do it with the

HTML5 <video> Player Controls in Chrome Three Dots on the Right Open Blank Screen

北城以北 提交于 2020-02-24 05:50:06
问题 Can't seem to find an answer for this anywhere. I am using a standard HTML5 tag to embed a video into page: <video controls> <source src="video/intro-video.mp4" type="video/mp4"/> </video> However, in Chrome's default controls on the right, three dots show up (options), however, when you click on them, it goes to a blank screen and there's no way to get out if it except for refreshing the entire page. How do you make the options either go away or prevent a blank screen? Thank you. 回答1: I know

Restful-based video streaming

ⅰ亾dé卋堺 提交于 2020-02-20 09:32:46
问题 Using spring boot, I want to make RESTful-based video player. I have my .mp4 extension videos in my file browser. How can I serve these videos on the frontend side by creating a rest endpoint? I've tried this method. The video can be started or stopped. But it can not be done backwards or forwards. Can not get it to the desired minute and start. 回答1: Spring Content supports video streaming out of the box. Using Spring Content for the file-system (FS) you would be able to create yourself a

where to place local video files for android webview html5 hybrid app

旧街凉风 提交于 2020-02-10 04:24:24
问题 I am loading html page from asset folder to android webview, the html pages has video. Other images are loaded clearly but video is not loaded i mean not plays in app. Where to place the local video file? I tested by placing video files in asset folder and raw folder, but not plays video. webView.loadUrl("file:///android_asset/index.html"); // load html file video.src="file:///android_res/raw/test.mp4"; // load video file from raw folder and video.src="file:///android_asset/test.mp4"; // load

HTML: Attaching a seperate audio to a video not working

江枫思渺然 提交于 2020-02-06 11:22:12
问题 Working with React.JS and trying to render a default video with sound. The issue is, I have a seperate file for the video and the sound. The video is working fine, but i'm not sure how to "synch" them, so that both the audio and the video play at the same time, and the user can use the video controls to stop the audio. Here is my current code: <video controls // controlsList="nodownload noremoteplayback" width={sWidth} height={sHeight} autoPlay={true} id={index} onEnded={() => this.nextVideo

Why does a <video> stop playing when removed from the DOM, while it can still play detached?

只愿长相守 提交于 2020-02-06 06:29:46
问题 I was working on a custom component and stumbled upon this strange behavior. Basically, it is possible to play a video file without adding a <video> element to the DOM at all. const video = document.createElement('video'); video.src = "https://upload.wikimedia.org/wikipedia/commons/transcoded/c/c6/Video_2017-03-19_23-01-33.webm/Video_2017-03-19_23-01-33.webm.480p.webm"; function start() { if (video.paused) { video.play(); console.log('paused', video.paused); } } <div><button onclick='start()'