I have tried:
<a href="https://.../myVideo.mp4" download>Download video</a>
but when I click, it opens the video on new tab. How can I instead initiate the download as file (maybe with javascript if there is no other way) ?
Also, I am really annoyed because the built in html video controls do have this download functionality and also there is no CORS issue with the built in video player. So why there just cannot be an easy way to have a video.download() API ?? Is there a reason for this ?
My question is related to: How to customize HTML5 Video Download Button which has not been answered yet.
Using direct https url will probably never work since the browser will treat it as an outide link.
Try using relative path of your video rather than using the https url. Ex below:
<a href="folder1/folder2/myVideo.mp4" download>Download video</a>
Related
My hosting doesn't allow me to upload mp3 or any audio files, so is there any way I can link audio in some other way? I know we can embed soundcloud and stuff but just wondering if there was any other alternative.
I’ve found this very useful guide that covers some alternatives:
Linking to a sound file using a href allows a browser to open and play
an audio file if the viewer of your web page has properly configured
their Internet browser. You can also use the tag or the newer
tag to insert a sound file directly into a web page.
<a href> tag
<a href="https://www.computerhope.com/jargon/m/example.mp3">Play sound
file</a>
<audio> tag
The tag can create a media player as part of the web page. It allows the visitor to play, stop, pause, or download an audio file. The element is compatible with all modern web browsers.
<audio controls>
<source src="https://www.computerhope.com/jargon/m/example.mp3" />
</audio>
<embed> tag
An older method of including audio files is to use the tag. While this method certainly works, it is less efficient than those which were mentioned above. As such, we recommend using one of the solutions demonstrated above.
<embed src="https://www.computerhope.com/jargon/m/example.mp3">
I figured the best way to do it without uploading your audio/music, BASE64 ENCODING!!
Very easy, kinda messy and supposed to be used for images I guess but works fine with audios and should work with videos as well (haven't tried videos)
Here a base64 encoder: https://omatsuri.app/b64-encoding
WARNING THOUGH! IT MIGHT GET LAGGY & MESSY
NOT recording using webcam or microphone...
But record (and also save) the video that is currently streaming or playing in the browser.
This works for not-live videos from youtube and the like: Use browser developer tools. For example firefox web developer tools network tab open go to the page and look for the get respond that has return type of video/* (video/mp4 in youtube) right click on it and select open in new tab and then just use browser's save (CTRL-S) to save the video. I believe this to work similiarly in chrome.
Use developer tools of your browser to see all network traffic and save the video stream.
I'm trying to create a video pop-up that works on Apple devices and I've been playing around with fancyBox & some YouTube videos. Because YT uses Flash, this isn't going to work (which I am just now realizing)
Is there a way to open up an html5 video inside of this pop-up?
I already set that part up:
Here's the page where I'm already using fancyBox: http://legal-replay.com/video-test/
Please help!
<a class="iframe" src="http://www.youtube.com/embed/dP15zlyra3c?html5=1">Open HTML5 Video</a>
I don't know much about fancybox but it looks like you can just have it open any iframe you want, which will work with YoutTube's default embed method. Just pass html5=1 to the iframe.
From what I can tell scouting around stackoverflow, this is only supported for single videos, I don't know if you can force an entire playlist to use HTML5, that might still be a client-preference.
Source
Fancybox Howtwo
I have a question. I know youtube has supported html5 for some time, so I just tried disabling the adobe flash plugin and took a look at the page source. I found no video tag. Could anybody explain that?
Using chrome, after disabling Flash, I do get a warning when trying to watch videos ("You need Flash!"), but it detects that I don't have flash, and uses the HTML5 version instead. If you use Chrome, you can look at the DOM with the developer tools (F12), and you'll indeed find a video tag in the video-container div, e.g.
<video class="video-stream" x-webkit-airplay="allow" src="http://o-o.preferred.twtelecom-dfw1.v15.lscache5.c.youtube.com/videoplayback?sparams=cp%2Cid%2Cip%2Cipbits%2Citag%2Cratebypass%2Csource%2Cexpire&fexp=900161&itag=43&ip=207.0.0.0&signature=55FCBF36A597656FECBEC8E78051B3BD30EE8D97.8F8D573710D767EAF4429FBC54C940DF7611A1BE&sver=3&ratebypass=yes&source=youtube&expire=1330650696&key=yt1&ipbits=8&cp=U0hSRVZQTl9OUENOMl9OSlJHOlBlcHJOMW9PSHhH&id=381980b5e867a1c5" data-youtube-id="OBmAtehnocU"></video>
For almost everything Google does on the web they use javascript. Most likely what is happening is that they test the browser to make sure it supports HTML5 video, they then load the the video dynamically using javascript.
To verify, use a web browser tool to inspect the current html as it's shown, not as it's sent to the browser.
And as Marius noted, be sure to have HTML5 enabled
I am learning the new HTML5 tags, and have a question about the video tag that I cannot seem to find a good example/answer for.
Can I provide a source as a URL, or does the source have to route from the web server? I am just trying to play with an example to see what it looks like, and use a youtube video as the source. Is this possible?
The source can indeed be a valid URL, which of course in this case needs to be a URL to a valid video file.