• Register
820 points
6 1

In this tutorial we are heading towards another topic that is how to embed youtube video in our web page without using the iframe tag to deal with this topic we have different methods but in this we will only do two because both are very easy to understand for embedding youtube videos. So, here we go

  1. <object> tag
  2. <embed> tag

<object> tag

Example:

<!DOCTYPE html>
<html>
<head>
    <title>Embed YouTube Video without iFrame</title>
</head>
<body>
    <object data='https://www.youtube.com/embed/nfk6sCzRTbM?autoplay=1' 
        width='560px' height='315px'>
    </object>
</body>
</html>


Approach


In the above example we have embedded a youtube video by using <object> tag,
So first we have titled the topic then the added object tag. Don’t  confused that object only used for embedding videos, <object> is a container. The source can be an image, URL, a plug-in application. We have also provided height and width attributes.

 

<embed> tag

Example:

<!DOCTYPE html>
<html>
<head>
    <title>Embed YouTube Video without iFrame</title>
</head>
<body>
<embed src="https://www.youtube.com/embed/nfk6sCzRTbM?autoplay=1"
    width="640" height="480" title="Everytime You Go Away - Paul Young"
        type="application/x-shockwave-flash">
    </body>
</html>

Approach

<embed> is a HTML5 attribute used for embedding youtube videos. But it is a little different from <object>. In the above code the title is given with the name of the topic and  source attribute where we will impart youtube video URL. This video link has a querystring that is named autoplay with value 1 and set it to 0 when we don’t want to autoplay the video. And the main difference is we must have to install adobe flash player in our computer to see the video.


Hope this will help.
 

 

820 points
6 1