Home
10 | 06 | 2008
Highslide JS for Joomla
Written by Ken Lowther   
Sunday, 20 April 2008 02:14

Highslide JS is a fabulous javascript thumbnail viewer written by Torstein Hønsi. It is highly configurable and its uses are limited only by your imagination. Click on the example images and links below to get a taste of what Highslide JS can do.

Highslide JS Examples

Click to enlarge Highslide JS
This instance uses graphic outlines to create a rounded border with a drop shadow. Full HTML captions can be assigned to each image, and a full HTML controlbar is created using custom overlays. This is a good combination for slideshows.
Highslide JS
You can add a caption below the expanded image. Use CSS to style the borders and captions. This image has no borders except bottom-border: 1px solid white at the image and the caption.
Highslide JS
You can open more than one image at a time, and arrange them on your screen by dragging them around. There are also specific CSS-classes for a blurred image. Notice how these borders change color when you open another image.
Highslide JS
The images by default try to expand equally in all directions from the thumbnails, but you can also position them in the center like this case. Or you can for instance specify a 200px left margin to keep your menu visible, or anchor the image to one corner of the thumbnail.
Highslide JS

HTML Content

Full HTML content

This example uses the htmlExpand method to display full HTML content in the expander. The width of the expanding div is set to 300px, while the height is omitted to allow Highslide to decide the best fit.

In the expander you can put all kinds of content, for instance form elements.

Scrolling HTML Content

Powered by Highslide JS

AJAX Content

Simple overlay text

Dynamic AJAX Content

Content in iframe

Powered by Highslide JS

Display flash

This is replaced by the Flash content. Place your alternate content here and users without the Flash plugin will see this.

Though Highslide JS is very configurable, its implementation into the Joomla environment can be somewhat intimidating, especially for novice users.

Highslide JS for Joomla exposes all of the flexibility of Highslide JS through a clear and concise configuration screen and JCE editor dialogs. The intent is to allow anyone, regardless of their skill level, to take full advantage of all that Highslide JS has to offer while minimizing, as much as possible, the need to get down to hardcore HTML coding.

Last Updated ( Wednesday, 20 August 2008 06:27 )
Read more...