Image Thumbnail Viewer not center image

[noobster]

1) Script Title: Image Thumbnail Viewer

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

3) Describe problem:

Hi, here it is.

i have setup the dynamic thumbnail viewer and everything works fine (images and tn are coming from a database, all is well...)

but one of the functions that seems interesting at first glance bothers me :p

i would like to be able to position the div (frame) that contains the magnified original image.
With default script it opens in a frame centered whatever happens.
If i edit that part:

if (position=="center"){
pgyoffset=ns6? parseInt(pageYOffset) : parseInt(ietruebody().scrollTop)
horzpos=ns6? pageXOffset+window.innerWidth/2-imgwidth/2 : ietruebody().scrollLeft+ietruebody().clientWidth/2-imgwidth/2
vertpos=ns6? pgyoffset+window.innerHeight/2-imgheight/2 : pgyoffset+ietruebody().clientHeight/2-imgheight/2
if (window.opera && window.innerHeight) //compensate for Opera toolbar
vertpos=pgyoffset+window.innerHeight/2-imgheight/2
vertpos=Math.max(pgyoffset, vertpos)
}
else{
var horzpos=ns6? pageXOffset+e.clientX : ietruebody().scrollLeft+event.clientX
var vertpos=ns6? pageYOffset+e.clientY : ietruebody().scrollTop+event.clientY
}

by editing the red part and removing the center tag, i should be able to position this div at will but i don't know much about this script function.

if this script can't be modified, is there anything that does about the same?

i tried Image Thumbnail Viewer II but can't use it with a database.

thanks in advance

[jscheuer1]

You don't need to edit the script. The way the script was written, the author intended just two choices of position but, there are really much more.

The obvious two choices are:

1 ) At the position of the mouse when clicked:


onclick="return enlarge('photo1.jpg',event)"

2 ) In the center of the page:


onclick="return enlarge('lemoncake.jpg',event,'center',300,375)"

The centering will only work as intended if you give it the true dimensions (red in the above) of the image. This is where it gets interesting. If you give different dimensions, this will shift the position where it gets displayed in the window. Play around with these dimensions and you can get it to show up wherever you like, relative to the center of the window. Don't set it too far from center though. If you do, and the user has a small window/screen, they might not see the image at all.

If you still want to edit the script as you were indicating, replace both the red parts:


var horzpos=ns6? pageXOffset+e.clientX : ietruebody().scrollLeft+event.clientX
var vertpos=ns6? pageYOffset+e.clientY : ietruebody().scrollTop+event.clientY

with a number (use the same number for both red parts) - use the number of pixels from the left of the window where you want the image to show up at and, replace both of the blue parts with a number (use the same number for both blue parts) - use the number of pixels from the top of the window where you want the image to show up. Be careful here too. If the numbers are too large, the image will be beyond the viewing area of a small window/screen. Example:


var horzpos=ns6? pageXOffset+175 : ietruebody().scrollLeft+175
var vertpos=ns6? pageYOffset+100 : ietruebody().scrollTop+100