Playing links to audio on click [duplicate] - javascript

This question already has answers here:
switch audio source with jquery and HTML5 audio tag
(2 answers)
Closed 3 years ago.
My web page includes a bunch of links that are generated via php. These are links to mp3 files, and right now when I click on them the sound starts playing in a new tab. How can I add a script so that all links start playing the source sound directly in the same tab when clicked (and stop when re-clicked)? Apologies in advance for a possibly stupid question, but please have mercy as I am very new to all of these things.
value1
value2
value3

You should be using an audio tag like the following:
<audio controls>
<source src="horse.mp3" type="audio/mpeg">
Your browser does not support the audio tag.
</audio>
Read more here: https://developer.mozilla.org/en-US/docs/Web/HTML/Element/
Also, the target="_blank" attribute will cause the link to open in a new tab.
Good luck on your coding journey!

Related

Why <bgsound src="music/binks.mp3"/> is not working? [duplicate]

This question already has answers here:
Difference Between HTML <audio>, <bgsound> and <embed> audio tags
(2 answers)
Closed 26 days ago.
I want to play some background music in my own website , I've been searching for 15 minutes and everything seems outdated.
Can someone help me?
<body>
<bgsound src="music/binks.mp3"/>
</body>
<bgsound src="music/binks.mp3"/> ->>> THIS seems to me outdated , and its not working
Should be able to use something like <audio>:
<audio id="background-music" src="path/to/music.mp3" loop></audio>
And then the following in a js file or in a script tag to play the music.
const music = document.getElementById("background-music");
music.play();
Do keep in mind most browser have autoplay policy now, so often the sound will be blocked.

How to load the video at a specific time? [duplicate]

This question already has answers here:
html5 video button that takes video to specific time
(2 answers)
Closed 9 months ago.
Edit: I have reviewed the other posts with a similar question and those do not resolve this issue. The #-t open just gets passed as a GET variable to my proxy script.
The following is to load a video. The source of the video is a php script that checks to ensure user is logged in then outputs the video. This is to ensure that only people logged in can download the video.
How do I specify a time to start the video position at?
<video id="test" width="640" height="360" controlsList="nodownload" controls>
<source src="vidRedir.php?v=video" type="video/mp4">
Your browser does not support the video tag.
</video>
Append #t=<time in seconds> to the URL. For example, setting src to vidRedir.php?v=video#t=30 will start the video at 30 seconds.
See this MDN article.
const video = document.querySelector('video');
video.currentTime = <Your time here>
https://developer.mozilla.org/en-US/docs/Web/API/HTMLMediaElement/currentTime

How to make HTML audio tag work in Opera?

i'm trying to add autoplay audio in my html page and i already tried embed and audio with and without controls and optional attributes, and absolute path. Tried different formats, though i know that Opera supports .ogg. My last try is here:
<audio controls id="music1">
<source src="./models/laughing.ogg" type="audio/ogg"/>
</audio>
html page and audio file are located like this:
if i press play button audio is played, but when i start my entire project the button is covered (as should be). And anyway i want it to be autoplay so
My Opera is the last version, Windows
Autoplay doesn't typically work. You need some sort of user interaction, like a click.
There is nothing you can really do about this. It's a browser "feature" to prevent ads from playing audio in the background.
<audio controls autoplay>
Try adding "autoplay" inside the voice tag.

Will it always be possible to play an audio file with the HTML5 <video> tag?

I've always noticed that you can play audio files with the HTML5 <video> tag. It seems really handy, considering that you only have to use 1 element to play videos and audio. An example would be this JSFiddle.
<video src="http://www.w3schools.com/html/horse.mp3" controls></video>
My first question is: Is this something that is here to stay, or is this a fluke that browsers plan on removing later on?
And if not, how do I know if a file is a video or audio using JavaScript? Because if I'm correct, can't .ogg files be video or audio? I'm trying to make a mediaplayer app for Chromebooks but I need to be able to differentiate audios from videos.

Output sound using JavaScript [duplicate]

This question already has answers here:
How to play audio?
(22 answers)
Closed 9 years ago.
I want to make an online metronome using JavaScript. Recently people around me started needing them but there isn't any decent one that doesn't use Flash. So I thought why not.
Before starting I want to make sure it's possible to do this with JavaScript. Basically all I need to know is if it's possible to output a sound, if it is then the rest should be simple enough.
So is it possible? If yes, how?
P.S.: I checked the HTML5 audio tag and I don't think it's gonna work. It's not one long file with the metronome sounds. It's a loop that runs the sound every time it should.
The audio tag is the right tool for this:
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/audio
Create an audio tag - something like:
<audio id="m" loop>
<source src="metronome.mp3">
</audio>
And either make it loop using the appropriate options on the tag (loop), or you can script it in JS:
<script>
// goes inside whatever event handler - when the user clicks a button, timer, etc.
document.getElementById('m').play(); // play the sound
</script>
This article provides a good introduction:
http://html5doctor.com/native-audio-in-the-browser/
If you need it to work in older browsers, you can resort to using Flash (which is "traditionally" how this sort of thing has been done). But as you mention - it's a good idea to avoid this for new development. The audio tag is supported in IE9+ and Chrome, FF, Safari, Opera.
You can use my play() function: http://pastebin.com/GKRx0GDk
It uses the HTML5 audio tag.
play('click.wav');
Just put that on a setInterval if you need it to repeat at a certain time.

Categories