View Full Version : Thumbnail popup print button

jamie smith
04-09-2005, 07:13 PM
Hi, can anybody help me?

I am trying to adapt a dynamic drive thumbnail popup script so that the popup has a print button at the top which will link to another page for printing purposes. My problem is that the popups appear during a slideshow, you can click on an image in the slideshow opening the popup, so each popup on the page needs to link to a different printpage.
Any help would be greatly appreciated.


<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">


<link href="port2.css" rel="stylesheet" type="text/css">
<link href="roll4.css" rel="stylesheet" type="text/css">

<script language="javascript" type="text/javascript">

var SlideShowSpeed = 3000;
var CrossFadeDuration = 2;
var picture = new Array();
var caption = new Array();
var links = new Array();
var ie=document.all
var ns6=document.getElementById&&!document.all

picture[0] = "pic/bcn2.jpg";
picture[1] = "pic/bcn1b.jpg";
picture[2] = "pic/bcn3.jpg";
picture[3] = "pic/bcn4.jpg";

caption[0] = "pic/btn1.gif";
caption[1] = "pic/btn2.gif";
caption[2] = "pic/btn3.gif";
caption[3] = "pic/btn4.gif";

links[0] = "javascript:void enlarge('pic/mag1.jpg','center',450,251,-30,-200)";
links[1] = "javascript:void enlarge('pic/mag1.jpg','center',450,251,-30,-200)";
links[2] = "javascript:void enlarge('pic/mag1.jpg','center',450,251,-30,-200)";
links[3] = "javascript:void enlarge('pic/mag1.jpg','center',450,251,-30,-200)";

preload= new Array()
for(i =0 ; i < picture.length; i++){
preload[i] = new Image();
preload[i].src = picture[i];

function control(how){
if (how=="F"){count++}
if (how=="B"){count--}


if (document.all){

document.images.picturebox.src = picture[count]
document.images.captionbox.src = caption[count]
document.getElementById("theLink").href = links[count];

if (document.all){


function setDescription(strText)
document.getElementById("objDescription").innerHTML = strText;

* Image Thumbnail viewer- ?Dynamic Drive (www.dynamicdrive.com)
* Last updated Sept 26th, 03'. This notice must stay intact for use
* Visit http://www.dynamicdrive.com/ for full source code

var ie=document.all
var ns6=document.getElementById&&!document.all

function ietruebody(){
return (document.documentElement)?document.documentElement:document.body;
function enlarge(which,position,imgwidth,imgheight,top,left)
crossobj=document.getElementById? document.getElementById("showimage") : document.all.showimage;
crossobj.innerHTML='<div align="right" id="dragbar"><div id="copy">Copyright-Amalgam modelmaking Ltd.</div><a href="" id="print">Print&nbsp;&nbsp;&nbsp;&nbsp;</a><span id="closetext" onclick="closepreview()">X&nbsp;</span></div><img src="'+which+'">';

function closepreview(){

function drag_drop(e){
if (ie&&dragapproved){
else if (ns6&&dragapproved){
return false

function initializedrag(e){
if (ie&&event.srcElement.id=="dragbar"||ns6&&e.target.id=="dragbar"){
offsetx=ie? event.clientX : e.clientX
offsety=ie? event.clientY : e.clientY



document.onmouseup=new Function("dragapproved=false")


<body onLoad="showHot=true;self.focus();">

<div class="botbox">

<div id="showimage"></div>
<table width="390" border="0" cellspacing="0" cellpadding="0" align="right">
<td width="330"><a href="#" id="theLink"><img src="pic/bcn2.jpg" style="cursor:url(james.cur),auto;" onclick="return enlarge('pic/mag1.jpg','center',450,251,-30,-200)" name=picturebox width=330 height=220 border=0></a></td>
<td width="60" valign="bottom"><a href="javascript:control('F');" class="aro2" ></a><a href="javascript:control('B');" class="aro1"></a></td>

jamie smith
04-10-2005, 10:15 AM
Hi me again.

Im still trying to get this to work. The problem is that the popup window is the same on everyslide its just the image that changes. Is there a way to put a print button in this popup that will somehow recognise that the image has changed and take u to the appropriate page?

04-10-2005, 01:36 PM
jamie smith,

Forgive me if I am mistaken but, if memory serves, you've been posting quite a few script related questions lately (last few weeks) and although you often provide pasted in script, you rarely, if ever provide the link to it. I for one would be more inclined to help if there were (ranked from most preferred to least)

1) A link to the dynamic drive script in question along with its name as it appears on its page And a link to your page where you are trying to get the script to work.

2) Same as above but, without link to your page

3) Same as #1 without your page or the name of the script.

A link to a working copy of the script (the one here on dynamic drive for this forum) makes it much easier for me to give useful suggestions and/or code modification. Just my 2 cents.

04-10-2005, 01:57 PM
The above being said, this code snippet is where things are 'happening':
crossobj.innerHTML='<div align="right" id="dragbar"><div id="copy">Copyright-Amalgam modelmaking Ltd.</div><a href="" id="print">Print&nbsp;&nbsp;&nbsp;&nbsp;</a><span id="closetext" onclick="closepreview()">X&nbsp;</span></div><img src="'+which+'">';The variable 'which' contains the path (either relative or absolute) and filename of each image, otherwise the images would not display in the pop up. For your '<a href="" id="print">' to do anything specific as regards the individual images, it must reference this variable. For example, to display the image by itself in the browser you could use:
<a href="'+which+'" id="print">in the above snippet. Note the use of both double and single quotes.