Build an HTML Audio and Video Player - Build an HTML Audio and Video Player

HTML-CSS
1

Tell us what’s happening:

Please help
9. Inside the video element, you should have a source element.
10. The source element should have a src attribute pointing to a video file.
11. The source element should have a type attribute

Your code so far

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
  <title>HTML Audio and Video Lab</title>
</head>
<body>

</body>
</html>
<h1>Main tiltle</h1>
<section>
  <h2>Video playing</h2>
  <video
  controls
  width="640"
  src="https://cdn.freecodecamp.org/curriculum/labs/What is the map method and how does it work.mp4" type="video/mp4"/>
  </video>
  </section>
<section>
  <h2>Song title</h2>
  <audio
  controls
  loop
  src="https://cdn.freecodecamp.org/curriculum/js-music-player/sailing-away.mp3"></audio>

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/140.0.0.0 Safari/537.36 Edg/140.0.0.0

Challenge Information:

Build an HTML Audio and Video Player - Build an HTML Audio and Video Player

2

I have a problem in 17. The audio element should have a src attribute pointing to an audio file.

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0"/>
  <title>HTML Audio and Video Lab</title>
</head>
<body>
<h1>HTML Audio and Video Lab</h1>
<section>
  <h2>What is the map method and how does it work</h2>
  <video width="640" controls>
    <source src="https://cdn.freecodecamp.org/curriculum/labs/What is the map method and how does it work.mp4" type="video/mp4"></video>
</section>
<section>
  <h2>Sailing Away</h2>
  <audio controls loop>
    <source src="https://cdn.freecodecamp.org/curriculum/js-music-player/sailing-away.mp3" type="audio/mpeg"></audio>
</section>
</body>
</html>

What is my mistake here? Could you please specify?

3

hi @itiresenemiroglu ,

If you have a question about a specific challenge as it relates to your written code for that challenge and need some help, click the Get Help > Ask for Help button located on the challenge.

image
image493×196 5.09 KB

The Ask for Help button will create a new topic with all code you have written and include a link to the challenge also. You will still be able to ask any questions in the post before submitting it to the forum.

Thank you.

4

where is the source element? you did not add it

5

Thanks for your warning, it was my first post on the forum, I hope I submitted it correctly now.

1 Like