Wrote a jquery. imagesview plug-in that supports image dragging and scaling similar to ACDSee.

During project creation, the customer is always concerned about the front-end interface. This is not the case of another difficult customer. It is required to view high-resolution images after opening the thumbnail at the front end, and it is better to be as convenient as ACDSee. It supports drag and scale-in and scale-out.

I have seen this effect in a column in Sina. The impact is like flash. I haven't touched flash for many years. I am not very familiar with the current Action Script, so I came up with jquery to achieve this. jquery's thickbox supports Image Browsing, but it is not the customer's result. After half a day of Google's search, I didn't find a useful Js.CodeSo I had to write it myself.

First look at the effect (Click the image below and connect to it.)

Text connections are also supported.

Supports IE 7 +, Firefox 1.5 + (PC, Mac), safari2 +, opera9 +, chrome0.3 +

I tested the results in Google Chrome, IE7, and firefox3.0 ..

It took me a lot of time to show you this effect, mainly because this blog does not support defining CSS style files in the content.

In addition, cnblogs background editing does not support chrome very well, so we have to launch n browsers to go back and forth ~~

If you cannot see the effect, you have to look at the figure below:

Related Files (these files are included in the last attachment of the article ):

Bytes ------------------------------------------------------------------------------------------------ Imagesview.css -- Style File

Imagesview. js -- Imageview JS File

Toolsico.gif -- Button icon

Loadinganimation.gif -- load an animation

Jquery. js -- For the jquery script library, use jquery 1.2.6 or later. Otherwise, there is a problem with dragging.

Usage:

Bytes ------------------------------------------------------------------------------------------------

Reference imagesview.css, imagesview. JS, and jquery. js in the page header (two GIF image files and CSS files are placed in the same directory)

Image connection: <a href = "images/rs4.jpg" class = "imagesview" Title = "imageview code by Jinks. zhang "> </a>

Text connection: <a href = "images/rs4.jpg" class = "imagesview" Title = "imageview code by Jinks. Zhang"> supports text connections. </a>

Among them, class = "imagesview" is required, Title = ".. "The title is not defined here.

Download is provided in all attachment files:

Attachment: jquery.imagesview.rar