PDA

View Full Version : Image Thumbnail Viewer II integration with another script



Grid66
02-08-2008, 08:05 PM
1) Script Title: Image Thumbnail Viewer II

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

3) Describe problem:

I would like to integrate the thumbnail viewer script with the one on this page http://www.jtricks.com/javascript/window/box_centered.html so that when I click on the enlarged image, the pop-up box is displayed with the contents of another page.

So far my amateurish attempts have been unsuccesful. I have tried copying the pop-up centred box script into the page header then (unsuccessfully) amending the thumbnail2 javascript line


imageHTML='<a href="'+dest+'">'+imageHTML+'</a>'

to


imageHTML='<a href="'+dest+'" onclick="return show_hide_box(this, 200, 270, '2px solid')">'+imageHTML+'</a>'

in an attempt to invoke the pop-up box centered script but this doesn't work (embarressed smilie here).

Could someone perhaps suggest a method of integrating these? If it's too complex I won't bother but I was hoping that there is a simple solution.

thetestingsite
02-08-2008, 08:27 PM
In this function of thumbnail2.js, add the highlighted parts:



loadimage:function(linkobj){
var imagepath=linkobj.getAttribute("href") //Get URL to enlarged image
var showcontainer=document.getElementById(linkobj.getAttribute("rev").split("::")[0]) //Reference container on page to show enlarged image in
var dest=linkobj.getAttribute("rev").split("::")[1] //Get URL enlarged image should be linked to, if any
var description=(thumbnailviewer2.enableTitle && linkobj.getAttribute("title"))? linkobj.getAttribute("title") : "" //Get title attr
var imageHTML='<a href="'+imagepath+'" onclick="return show_hide_box(this, 200, 270, \'2px solid\')"><img src="'+imagepath+'" style="border-width: 0" /></a>' //Construct HTML for enlarged image
if (typeof dest!="undefined") //Hyperlink the enlarged image?
imageHTML='<a href="'+dest+'">'+imageHTML+'</a>'
if (description!="") //Use title attr of the link as description?
imageHTML+='<br />'+description
if (this.iefiltercapable){ //Is this an IE browser that supports filters?
showcontainer.style.filter=this.iefilterstring
showcontainer.filters[0].Apply()
}


Hope this helps.

Grid66
02-08-2008, 09:21 PM
Many thanks for the response testingsite

I tried the replacement you suggested by it didn't not work.

thetestingsite
02-08-2008, 09:23 PM
Can you post a link to the problem page so that we can see what's going on with it?

thetestingsite
02-08-2008, 11:11 PM
I just noticed that if you are using the script that you posted a link to (the centered box), there is no function called show_hide_box, but instead show_hide_centered_box. If you replace the part I posted before with this, it should work fine. But again, in any case, please post a link to the problem page.

Hope this helps.