YouTube Video as Website Background – Jquery Tubular

Jquery Tubular plugin was created by Sean McCambridge, a front-end developer from Chicago, USA. This awesome plugin  you can set a YouTube video as your website/ blog’s background. Just call it on yourtag with a YouTube video ID.

To add youtube video as background in your site or blog,

1. Add the JS File of the Tubular plugin into your page and download the JS file from the link upload in the server.

2. Now call the JS in your header

<script type="text/javascript" charset="utf-8" src="http://ajax.googleapis.com/ajax/libs/swfobject/2.1/swfobject.js"></script>

<script type="text/javascript" charset="utf-8" src="http://code.jquery.com/jquery-1.4.3.min.js"></script>

<script type="text/javascript" charset="utf-8" src="js/jquery.tubular.js"></script>

<script type="text/javascript" charset="utf-8">
      $().ready(function() {
                $('body').tubular('someYTid','wrapper'); // where someYTid is the YouTube ID and wrapper is your containing DIV.
        });
</script>

Replace the word someYTid in the code with ID of desired Youtube video which you can get from its URL like shown in the image below.

For more information, visit http://www.seanmccambridge.com/tubular/.

Advertisements

2 thoughts on “YouTube Video as Website Background – Jquery Tubular

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s