JavaScript let audio = document.getElementById("audio") // Take the audio element It's time for the most important thing, to create the basic logic in pure JavaScript, first we'll take all the elements from the HTML. We have a small track, gray, and when playing it will be almost black due to the increase in with the class time. Now let's move on to CSS, with its help we will change only the track, we will leave the buttons by default, as they are made in the browser. Let's break it down, with the class audio-track, this is the audio track, inside it there is a with the class time, this is the remainder of how long there is left to finish.Īlso go next are four tags, this button, the first to play music, the second to pause, the third switches to the previous track, the fourth button to the next. Since we now have a blank screen, we will add buttons to control, also a tag for the audio tracks. XHTML Īs you can see the standard HTML player looks nice, but there is one problem, its capabilities are limited, you can only stop the track and change the volume and all, which in my opinion is not enough, so we will remove the attribute controls, after which we will have an empty screen. Let's start with HTML, there is nothing complicated here, just write the tag inside the document and add an attribute controls. Creating an audio player:įirst, let's analyze the logic of the player and what we implement here, and implement the switching of tracks, and the playlist itself, as for the pause, then in HTML already by standard it is. In this article you will read about how to make an audio player for your website with copyright free music in JavaScript and HTML, if you are wondering how to do it, you are here.Īlso check out our HTML tutorial if you don't know it well.
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |