You are on page 1of 2

addimagezoom() function options HTML Attribute Default Description zoomrange undefined (no resizing of magnified image).

Sets the zoom le vel of the magnified image relative to the original image. The value should be i n the form [x, y], where x and y are integers that define the lower and upper bo unds of the zoom level. For example: [3, 3] //sets the zoom level to 3, with no ability to toggle the zoom level [2, 10] //sets the initial zoom level to 2, with ability to increase up to 10 by using the mouse wheel. The default value for this option is undefined, which means the script will simp ly display the magnified image in its original dimensions with no resizing. The largeimage option below lets you define the large image that should be used as t he magnified image. magnifiersize [200, 200] Sets the magnifying area's dimensions in pixels. Default is [200, 200], or 200px wide by 200px tall. magnifierpos "right" Sets the position of the magnifying area relative to the original image. Enter "right" or "left". Default is "right". largeimage undefined (original image used as magnified image). Specifie s the full path or URL to the magnified image. This should be a larger, higher r esolution version of the original image, for example: $('#image1').addimagezoom({ zoomrange: [3, 10], largeimage: 'myimages/haydenlarge.jpg' }) If you omit the zoomrange option, the large image will not be resized (to a powe r of the original image). You would do this when the magnified image is already at the magnification level you want: $('#image1').addimagezoom({ largeimage: 'http://mysite.com/images/car.jpg' }) Notice that I left out the "zoomrange" option, which causes the natural dimensio ns of the large image to be used, with no resizing. The default value for largei mage is undefined, which causes the script to simply use the original image as t he magnified image as well. In this case you'll want to make sure zoomrange is d efined so the magnified image is enlarged in some way: $('#image1').addimagezoom({ zoomrange: [5, 5] })

curshade v1.5 false Boolean that when set to true shows a magnifying lens on top of the thum bnail image while the mouse is over it. Default is false. cursorshadecolor v1.5 "#fff" HTML color string that sets the background color of the magnifying lens. cursorshadeopacity v1.5 0.3 Decimal value that sets the degree of opacity of the lens, where 1 is fu lly opaque (as if no opacity is applied), and 0.1 is almost transparent.

cursorshadeborder v1.5 "1px solid black" tyle of the border of the lens.

CSS string value that sets the s

You might also like