Tuesday, March 3, 2009

Image Zoom in/out

We have so many image zoom in /zoom out functionality, But in this we make is so simpler and make it compatible with so many browsers with less javascript.

Highslide JS

Highslide JS is an open source JavaScript software, offering a Web 2.0 approach to popup windows. It streamlines the use of thumbnail images and HTML popups on web pages. The library offers these features and advantages:

* No plugins like Flash or Java required.
* Popup blockers are no problem. The content expands within the active browser window.
* Single click. After opening the image or HTML popup, the user can scroll further down or leave the page without closing it.
* Compatibility and safe fallback. If the user has disabled JavaScript or is using an old browser, the browser redirects directly to the image itself or to a fallback HTML page.

URL for this is highslide

You can visit the above URL and download the free script code. In this site we have so many zoom in/out scripts used which are so user friendly and can be easily implemented.

Installation

Note: some basic HTML knowledge is required to install Highslide.

1. Download and extract the zip-archive from the download page.
2. Run the file index.html, navigate to your favourite setup and view the source.
3. Change the file to suit your needs, or copy and paste parts of it into your HTML file. If you mess it up, go back to the original file and change it bit by bit. Study the documentation and the API reference for advanced features.
4. If you move the Highslide JS files, remember to change the graphicsDir setting in the Javascript.

No comments:

Post a Comment