Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New Coder
    Join Date
    Mar 2005
    Posts
    39
    Thanks
    0
    Thanked 0 Times in 0 Posts

    popup with print button

    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.

    Code:
    <html>
    <head>
    
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    
    <title>PORTFOLIO</title>
    
    <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)";
    
    count=0
    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(count<0){count=picture.length-1}
    if(count>picture.length-1){count=0}
    
    if (document.all){
    document.images.picturebox.style.filter="blendTrans(duration=2)";
    document.images.picturebox.style.filter="blendTrans(duration=CrossFadeDuration)";
    document.images.picturebox.filters.blendTrans.Apply();
    }
    
    document.images.picturebox.src = picture[count]
    document.images.captionbox.src = caption[count]
    document.getElementById("theLink").href = links[count];
    
    if (document.all){
    document.images.picturebox.filters.blendTrans.Play();
    }
    
    }
    
     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.style.left=top+"px";
    	crossobj.style.top=left+"px";
    	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+'">';
    	crossobj.style.visibility="visible";
    }
    
    function closepreview(){
    crossobj.style.visibility="hidden"
    }
    
    function drag_drop(e){
    if (ie&&dragapproved){
    crossobj.style.left=tempx+event.clientX-offsetx+"px"
    crossobj.style.top=tempy+event.clientY-offsety+"px"
    }
    else if (ns6&&dragapproved){
    crossobj.style.left=tempx+e.clientX-offsetx+"px"
    crossobj.style.top=tempy+e.clientY-offsety+"px"
    }
    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
    
    tempx=parseInt(crossobj.style.left)
    tempy=parseInt(crossobj.style.top)
    
    dragapproved=true
    document.onmousemove=drag_drop
    }
    }
    
    document.onmousedown=initializedrag
    document.onmouseup=new Function("dragapproved=false")
    </script>
    
    </head>
    
    <body onLoad="showHot=true;self.focus();">
    
    <div class="botbox">
    
    <div id="showimage"></div> 
    <table width="390" border="0" cellspacing="0" cellpadding="0" align="right">
      <tr>
          <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>
        </tr>
    </table>
    </div>
    </body>
    </html>

  • #2
    New Coder
    Join Date
    Mar 2005
    Posts
    39
    Thanks
    0
    Thanked 0 Times in 0 Posts
    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?


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •