Playlist Tutorial
Introduction
The JavaScript playlist for the JW Player is an easy to use alternative to the built in Flash playlist. It offers all of the same functionality as the built in playlist, and allows users to style its appearance via CSS.
Installation
Setting up the JW Player's JavaScript playlist is fast and easy. Just follow these simple steps and you'll be up and running in no time!
- Download the following files and place them on your web server.
- Add the following HTML to all pages that will use the JavaScript.*
<script type="text/javascript" src="http://www.mydomain.com/jwplaylist/jquery.js"></script> <script type="text/javascript" src="http://www.mydomain.com/jwplaylist/jquery.playlist.js"></script> <link rel="stylesheet" type="text/css" href="http://www.mydomain.com/jwplaylist/playlist.css" />
* We recommend placing this HTML in the <head> of your page, but any place before your first JW Player should be fine.
Stylizing the JavaScript Playlist
To stylize the JavaScript playlist, simply edit the included playlist.css. All of the elements and their default styles are listed.
Structure of the JavaScript Playlist
This is the HTML structure of the JavaScript Playlist. It is provided for your reference when stylizing the controlbar.
<div class="jw_playlist_playlist"> <div class="jw_playlist_item even"> <div class="jw_playlist_image_div"> <img class="jw_playlist_image" src="image.jpg"/> </div> <div class="jw_playlist_title"></div> <div class="jw_playlist_description"></div> <div class="clear"/> </div> <div class="jw_playlist_item odd"> <div class="jw_playlist_image_div"> <img class="jw_playlist_image" src="image.jpg"/> </div> <div class="jw_playlist_title"></div> <div class="jw_playlist_description"></div> <div class="clear"/> </div> ... </div>
JW WMV Player
Download the newest JW Player built with Silverlight. It’s as flexible as the FLV Player but works with Windows Media files. What could be better?
