YouTubin’ Plugin for jQuery


YouTube

YouTubin’ is a jQuery plugin that makes embedding YouTube videos clean, easy and unobtrusive. In its simplest form, YouTubin’ grabs any links that point to a YouTube page and replaces them with an embedded video. To do so, YouTubin’ leverages SwfObject 2 if available, but otherwise just embeds the video through standard markup.

Advanced options include flagging specific video elements using a jQuery selector and setting a variety of swf properties such as dimensions, flash version, flashvars and params. Youtubin’ can even be used to cause the video to embed once a link is clicked rather than when the page loads.

Download YouTubin’ jQuery Plugin

How to use YouTubin’

Basic YouTubin’ is extraordinarily simple. Just include the Javascript files for jQuery, YouTubin’ and optionally SwfObject 2, then write:

$(function() {
    $.youtubin();
});

This will pull in any links to YouTube video pages and replace them with an embedded video.

If you only want to replace certain links, say those with the class “youtube”, you can call YouTubin’ from any jQuery selector:

$(function() {
    $('a.youtube').youtubin();
});

If you want, you can pass custom options as an object in the first argument of youtubin():

$(function() {
    $('a.youtubin').youtubin({
        swfWidth : 400,
        swfHeight : 360
    });
});

Here we are setting the dimensions of the embedded video to 400px wide and 360px tall. Among the other options you can set replaceTime: 'click' if you want YouTubin’ to embed the video when a user clicks on the link rather than replacing all the links automatically. For a complete list of options please check the YouTubin’ documentation.

Finally, for best results with any method, include the Javascript for SwfObject 2 and YouTubin’ will automatically leverage it.

Download YouTubin’ jQuery Plugin



Jon Raasch

Jon Raasch is a UX nerd and free-lance web designer / developer who loves jQuery, Javascript & CSS.




You Might Also Like:


2 Comments to “YouTubin’ Plugin for jQuery” RSS 2.0

  1. Amir says:

    Hey, nice plugin. Does it also work for links that just have youtube.com or uk.youtube.com or http://youtube.com in them?

  2. M2E says:

    I’ve been looking for this.
    At first I found oembed, but not suite my needed.
    Finally I found YouTubin. This is very useful plugin.

    Awesome man!!



Leave a Reply



  • HTML permitted
  • Wrap code in <pre><code></code></pre>
  • Escape HTML to display as text