JW Image Rotator
Image Rotator Flashvars
Flashvars are variables you can insert into your HTML code to control both behavior and appearance of the Image Rotator. With the swfobject embed method, you add them with the addVariable() function and with the embed tag method they are inside the flashvars attribute, stacked with an & symbol.
Note that you must urlencode the three glyphs ? = & inside flashvars, because of the way these flashvars are presented to the player. The urlencoded values for these symbols are listed here:
- ? → %3F
- = → %3D
- & → %26
So if your file to play is at the location getplaylist.php?id=123&type=flv, you must set the file flashvar to getplaylist.php%3Fid%3D123%26type%3Dflv.
Basics
- height (320): Sets the overall height of the rotator.
- width (260): Sets the overall width of the rotator.
- file (undefined): Sets the location of the playlist to play. The imagerotator only plays playlists.
Appearance
- backcolor (0xFFFFFF): Backgroundcolor of the controls, in HEX format.
- frontcolor (0x000000): Texts & buttons color of the controls, in HEX format.
- lightcolor (0x000000): Rollover color of the controls, in HEX format.
- logo (undefined): Set this to an image that can be put as a watermark logo in the top right corner of the display. Transparent PNG files give the best results (example).
- overstretch (false): Sets how to stretch images to make them fit the display. The default stretches to fit the display. Set this to true to stretch them proportionally to fill the display, fit to stretch them disproportionally and none to keep original dimensions.
- screencolor (0x000000): Color of the display area, in HEX format. With the rotator, change this to your HTML page's color make images of different sizes blend nicely.
- showicons (true): Set this to false to hide the activity icon and play button in the middle of the display.
- shownavigation (true): Set this to false to completely hide the navigation bar.
- transition (random): Sets the transition to use between images. The default, random, randomly pick a transition. To restrict to a certain transition, use these values: fade, bgfade, blocks, bubbles, circles, flash, fluids, lines or slowfade.
- usefullscreen (true): Set this to false to hide the fullscreen button and disable fullscreen.
Behaviour
- audio (undefined): Assigns an additional, synchronized MP3. Use this for background music.
- linkfromdisplay (false): Set this to true to make a click on the display result in a jump to the webpage assigned to the link playlist metadata.
- linktarget (_self): Set this to the frame you want hyperlinks to open in. Set it to _blank to open links in a new window or _top to open in the top frame.
- repeat (false): Set this to true to automatically repeat playback of all images. Set this to list to playback an entire playlist once.
- rotatetime (5): Sets the duration in seconds an image is shown before transitioning again.
- shuffle (false):Set this to true to playback the images in random order.
- volume (80): sets the startup volume of the MP3 background music.
API
- enablejs (false): Set this to true to enable javascript interaction. This'll only work online! Javascript interaction includes playback control, asynchroneous loading of media files and return of track information.
Config XML
If you have lots of flashvars and you don't want the list to mess up your HTML pages, you can also aggregate your flashvars in a single XML file. Next, use the config flashvar to assign the XML to your rotator. All vars inside the XML will then be parsed with one line of code. Any additional flashvars you do set in your HTML will override the ones that are in the config XML. Example XML:
<config> <file>slideshow.xml</file> <repeat>true</repeat> <backcolor>333333</backcolor> <volume>40</volume> <shownavigation>false</shownavigation> <audio>ambient.mp3</audio> </config>
