A jQuery plugin for animating YouTube thumbnails
HTML JavaScript
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
LICENSE
README.md
bower.json
example.html
previewtube.js
pvt_logo.png

README.md

PreViewTube.js

A small jQuery plugin for animating YouTube thumbnails.

##Demo previewtube.vool.ie

##Download

You can install PreViewTube using Bower:

$ bower install previewtube

Or if you prefer just grab a copy of the script

Usage

  1. Include jQuery:

<script src="path/to/jquery.min.js"></script>
```
  1. Include plugin's code:

    <script src="path/to/previewtube.js"></script>
  2. Call the PreViewTube plugin:

    <script>
      $(document).ready(function(){
      
      				$('.preViewTube').PreViewTube();
    				
    				// or
    
    				$('.preViewTube-constant').PreViewTube({
    					'interval' : 500,
    					'mode' : 'constant'
    				});
    
      });
    </script>
  3. Add some YouTube thumbnails:

    <img src="https://i.ytimg.com/vi/dQw4w9WgXcQ/2.jpg" alt="" title="" width="150" class="preViewTube"/>'

Options

The plugin has two options mode and interval both are optional.

####Interval The animation rate in ms
Default: 500ms

####Mode How the animation should run constant or hover
Default : hover

##A note on thumbnail size YouTube creates 4 thumbnails, 3 of these are sized 120px x 90px (1.jpg, 2.jpg & 3.jpg) and 1 sized 480px × 360px (0.jpg), because of this size difference it is important that the size is set on the img tag.

Although it may be best to make this width="120" you can get away with make this a bit bigger, I found width="150" look ok.

ToDo

Could be improved, might get around to it someday, sharing it is a start eh !