Notice: Undefined variable: extrahead in /home/tznqzkawbfzr/domains/dev.jonraasch.com/html/inc/blocks.inc.php on line 63
YouTubin' jQuery Plugin - Documentation

YouTubin' jQuery Plugin - Documentation

Created by Jon Raasch

The YouTubin' jQuery Plugin makes embedding YouTube videos on a website clean, easy and unobtrusive. Replacing links to YouTube pages with embedded video content, this plugin automatically leverages SwfObject 2 if it is available, and otherwise embeds the content via standard HTML.

Download YouTubin' jQuery Plugin

Basic YouTubin' usage

Of the two ways to call YouTubin', most users will be happy with the first method: 

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

When the page loads, this will parse any links that point to a YouTube video page (for example: <a href="http://www.youtube.com/watch?v=_c6HsiixFS8">Click here</a>) These will be replaced with an embedded video using the standard options.

If you would like to set any of the customizable options to YouTubin', simple pass these as an object in the first argument: 

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

Remember to keep the list comma separated, and to leave off the last comma.

Calling YouTubin' with a jQuery selector

YouTubin' can also be called from any jQuery object. For instance: 

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

This would grab any links with the class of 'youtube' and flag them for YouTubin'. If you want to set any options, simply pass them as an object in the first argument, like with the basic usage above: 

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

This method provides greater control over which links are replaced, allowing you to set different options for different links. For instance one could be embedded on page load, another when the link is clicked.

Additionally this method will work even if the link does not point to a YouTube page, so in this way you can use the YouTubin' plugin to embed any swf.

Customizable options for YouTubin'

swfWidth (String)
Width of the embedded video swf. For pixel measurement, pass a number (no 'px'). You can also pass a percentage. Defaults to "425".

swfHeight (String)
Height of the embedded video swf. For pixel measurement, pass a number (no 'px'). You can also pass a percentage. Defaults to "344"

replaceTime (String)
An option to control when the video replacement occurs. Defaults to 'auto' which embeds the videos on page load. Other option is 'click' which embeds the video once the flagged elment is clicked.

keepLink (Boolean)
An option to cause YouTubin' to append the video after the video link as opposed to replacing it. This only effects the 'auto' method.

wrapper (String) (Deprecated as of Youtubin v1.2)
Change this to customize the wrapper YouTubin' uses to contain the swf. Modify this if you want to append custom CSS to the embedded videos. Default is '<div></div>'

srcOptions (Query String)
Modify srcOptions to change the query string that is appended to the path to the YouTube video. Useful if you want to change the language option. Default is '?hl=en&fs=1' for the 'auto' replaceTime method and '?h1=en&fs=1&autoplay=1' for the 'click' method (or 'auto' if autoplay is set). Setting srcOptions overwrites any autoplay setting.

autoplay (Boolean)
Shorthand method for mmodifying autoplay behavior in srcOptions. This will be overwritten if anything besides the default srcOptions are used.

method (HTML Attribute String)
This is the HTML attribute that YouTubin' pulls from when forming the path to the swf. Defaults to 'href' but could be changed to 'src' or just about anything.

scope (jQuery object)
Controls the scope of where YouTubin' looks for YouTube links when not targeting a specific object. (The $.youtubin(); method).

iphoneBoot Boolean
Whether to boot iPhone users to YouTube (non-jail broken iPhones can't play flash videos so this boots them to YouTube to engage the iPhone's YouTube app). Defaults to true. Set to false if using YouTubin' for non-YouTube videos.

flashVersion (String)
Version of Flash the embeded swf uses, default is '8'. Only matters if using SwfObject 2. The default works fine for all YouTube videos.

expressInstall (Path String)
The path to expressInstall.swf, which is entirely optional. This only matters when using SwfObject 2. Defaults to ''.

flashvars (Object)
Any flashvars you want to pass to the embedded swf. Defaults to an empty object ( {} ), which works fine for YouTube videos.

params (Object)
Any params you want to set for the embedded swf. Defaults to {menu : "false", loop : "false" }.

YouTubin' links and examples

Licensing of YouTubin'

YouTubin' is released under the FreeBSD license:

Copyright (c) 2009 Jon Raasch (http://jonraasch.com/)

Redistribution and use in source and binary forms, with or without modification, are permitted provided that the following conditions are met:

  1. Redistributions of source code must retain the above copyright notice, this list of conditions and the following disclaimer.
  2. Redistributions in binary form must reproduce the above copyright notice, this list of conditions and the following disclaimer in the documentation and/or other materials provided with the distribution.

THIS SOFTWARE IS PROVIDED BY JON RAASCH 'AS IS' AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL JON RAASCH OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.

The views and conclusions contained in the software and documentation are those of the authors and should not be interpreted as representing official policies, either expressed or implied, of Jon Raasch, who is the man.

YouTubin' is not affiliated with YouTube in any way.

YouTubin' version history

Youtubin' 1.2

Released 11.02.2009

Youtubin' 1.1

Released 10.02.2009

Youtubin' 1.0

Released 08.25.2009

Youtubin' 0.1

Released 06.15.2009

Known Issues in YouTubin'

Embedded YouTube videos won't play in Safari 4 when not using swfobject

For now use swfobject to solve this problem (the swfobject implementation is a better method regardless)

Issue in IE for wrapper option with non-swfobject implementation

Use swfobject implementation to solve this problem.



Make A Donation