iframe can't find YouTube videos in HTML

Question

For a website I am designing for an assignment about kids films and I thought I would put an iframe in to show the trailer from a YouTube video. This is the code I used (just with a test video);

<iframe width="560" height="315" src="//www.youtube.com/embed/xxMcViTf7KU" frameborder="0" allowfullscreen>This is the test iframe</iframe>

The result is the page begins to load, then a box comes up saying 'file or directory not found'. As far as I am aware, the code is all correct. I don't understand what's wrong.

Any help would be greatly appreciated, thank you!

Answer 1

Don't forget the "http://" before your YouTube link. That's working fine:

<iframe width="560" height="315" src="http://www.youtube.com/embed/xxMcViTf7KU" frameborder="0" allowfullscreen>This is the test iframe</iframe>

Answer 2

You can try <embed-video></embed-video> like this:

Add this into your index.html-

<script src="https://www.youtube.com/iframe_api"></script>

Then use in your html like this:

 <div class="video-img-contr-2">
        <embed-video height="100%" width="100%" iframe-id="vimeo1" api="1" player_id="vimeo1" src="https://www.youtube.com/watch?v=qWiBjzY8j20">
              <a href="https://www.youtube.com/watch?v=qWiBjzY8j20">Watch</a>
        </embed-video>
     </div>

see in the snapshot: