jQuery Image Magnify: change position of enlarged image

[Michael-onSaba]

1) Script Title: :: jQuery Image Magnify v1.11

2) Script URL (on DD): http://dynamicdrive.com/dynamicindex4/imagemagnify.htm

3) Describe problem:
In one instance of jQuery Image Magnify, it works perfectly for me. In another instance, it doesn't, but I think it would if I could change the final position of the enlarged image. I'd like to have the enlarged image position have the same top and left coordinates as the original (smaller) image, and animate down and to the right, rather than in the center of the page (Or possibly the opposite, have the enlarged image keep same top and right coordinates and animate down and left). Any suggestions on how this might be accomplished? Thanks in advance.

[jscheuer1]

Use this updated version of the script:

3998

To use it add a data-orig attribute to the image, example:


<img class="magnify" data-orig="left" src="http://i26.tinypic.com/11l7ls0.jpg" width=125 height=90 alt="">

will expand from and be anchored to the top-left of the original image, while:


<img class="magnify" data-orig="right" src="http://i26.tinypic.com/11l7ls0.jpg" width=125 height=90 alt="">

will expand from and be anchored to the top-right of the original image. If you skip the attribute or set it to anything else the script will magnify in the usual manner (from the top left of the image to the center of the window).

Demo:

http://home.comcast.net/~jscheuer1/side/image_magnify/orig_pos.htm

Note: The data hyphen (data-orig in this case) attribute will work in any valid DOCTYPE. But it's only w3c valid in HTML 5.