Useful jscript image display code: WSN Support

Quick Links open

New Posts Member List

WSN Support » WSN Gallery » Useful jscript image display code » Useful jscript image display code

Useful jscript image display code
this might help someone out

Version:

Useful jscript image display code

knotworking
Experienced

Usergroup: Customer
Joined: Mar 31, 2004
Total Topics: 20
Total Posts: 83

Posted 05/07/05 - 07:27 AM:	#1
(this might already be posted but, I couldn't find it anywhere) For my purposes, I wanted members album thumbnail images to display the fullsize image in a new pop-up window when clicked with none of the image editing features that link.php offers. Here's the code I used to get a new pop-up with no window controls, etc: <!-- BEGIN REGULAR IMAGES --> <td {IMAGEWIDTH} valign="top" class="link" align="center" onClick="window.open('download.php?id={IMAGE ID}', 'Image_Display', 'width={IMAGEXWIDTH},height={IMAGEYHEIGH T},left=0,top=0,toolbar=0,location=0,directories=0,status=0, menuBar=0,scrollBars=0,resizable=1')" onMouseOver="this.style.cursor='hand'" onMouseOut="this.style.cursor='auto'">&# 60;IF {SWITCH_TITLES}><IF {IMAGETITLE}>{IMAGETITLE}<br> </IF></IF> <img src="thumbnail.php?id={IMAGEID}" border="0" {BORDEREFFECT} {MOUSEOVEREFFECT} alt="{IMAGEBOOKMARKTITLE}" onClick="window.open('download.php?id={IMAGE ID}', 'Image_Display', 'width={IMAGEXWIDTH},height={IMAGEYHEIGH T},left=0,top=0,toolbar=0,location=0,directories=0,status=0, menuBar=0,scrollBars=0,resizable=1')" onMouseOver="this.style.cursor='hand'" onMouseOut="this.style.cursor='auto'"> <br> <IF {THISMEMBERCANREMOVE[{IMAGEOWNERID}]}>&# 60;br> <a href="albums.php?action=remove&linkid={IMAGEID}&catid={CATID}">DELETE THIS IMAGE</a></IF> </td> <!-- END REGULAR IMAGES --> Note that width={IMAGEXWIDTH},height={IMAGEYHEIGHT} can be set to a fixed dimension, if you want the same size window each time. Here's the one drawback with using the X & Y dimensions from each image: the new window seems to put a 15px padding on the image so, you have to resize the window slightly to get the full image. I tried tinkering in download.php to add 25px or so onto each returned IMAGEXWIDTH IMAGEYHEIGHT to compensate for the padding but, no dice. Anyone know a hack for this?

Paul
Administrator

Usergroup: Administrator
Joined: Dec 21, 2001
Location: Northern California
Total Topics: 56
Total Posts: 5844

Posted 05/07/05 - 09:17 PM:	#2
Try width=<?php echo {IMAGEXWIDTH} + 25; ?>
_____________________ "Do things you love doing, because then it ain't work. Don't do something you don't really enjoy, because you're never going to work hard enough at it." - Bob Young, founder of Red Hat

knotworking
Experienced

Usergroup: Customer
Joined: Mar 31, 2004
Total Topics: 20
Total Posts: 83

Posted 05/08/05 - 07:23 AM:	#3
PHP to the rescue, that's the trick, thanks! On my tesing browser, a width of +20 and a height of +28 seemed to give an even boarder all the way around (gotta check it on FireFox and the others, though).

You don't have permission to post.

Please login or register.