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 5 of 5
  1. #1
    New Coder
    Join Date
    Jan 2006
    Location
    USA
    Posts
    60
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question Open popup template with called image

    Hey there,

    I've searched around to try and find a similar question but only found bits and pieces (which did help). I hope this is the correct forum for this post.

    I have many product pages with product thumbnail images. The images are in one directory and enlargements of these images are in another called 'popup'. On my product page I would like to click on the product thumbnail and have a popup window open with the enlarged image of that product from the popup directory. The catch is that I have a template popup window that I would like to use each time. I have gotten this formatted the way I would like it, I just need some way of inserting the enlarged image in popup window.

    I was wondering if a script in place of a src<""> image directory would work. I'm not sure if if this is something I need on the product page itself or if the code will reside in the popup template. Basically, this is a way around making a separate html popup window for each product...of which there are a lot!

    Any thoughs or insight would be greatly appreciated. Let me know if I should provide any of the code I have so far. Thanks!!!

    -Rob

  • #2
    Regular Coder 2reikis's Avatar
    Join Date
    Nov 2005
    Location
    California
    Posts
    167
    Thanks
    17
    Thanked 13 Times in 13 Posts

    got server side?

    Do you have access to a server-side language? It would be simple to do if you had, say ASP, PHP, or CGI.

  • #3
    New Coder
    Join Date
    Jan 2006
    Location
    USA
    Posts
    60
    Thanks
    0
    Thanked 0 Times in 0 Posts
    2reikis - Yes, I have access to many since this site is on a dedicated server. Most of the other scripts in the site are done with Perl. It would be great to be able to use that. However, someone else is doing the Perl coding and I am not familiar with it. I am just learning PHP, so have a small amount of fimiliarity with server side languages.

  • #4
    New Coder
    Join Date
    Jan 2006
    Location
    USA
    Posts
    60
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question

    Just thought I'd add something else. Suggestions from the Perl coder are:

    If the pop-up directory is called popup, then the javasript would be called like so:

    doPopup('mfgID/popup/lineID.jpeg');

    Now, the problem that is left is how to pass that string to the doPopup function. If we wrote the Javascript in-line on the page, our Perl code could simply write the call and insert the proper text string. However, I know that we've so far kept Javascript totally out of the HTML and probably want to continue doing so.

    We could add an attribute to the product image that contains the pop-up image string. Then, your Javascript could extract that attribute at run-time and use it to load the pop-up.

    Just wondered it this helps.
    -Rob

  • #5
    Regular Coder 2reikis's Avatar
    Join Date
    Nov 2005
    Location
    California
    Posts
    167
    Thanks
    17
    Thanked 13 Times in 13 Posts

    Jscript can do this...

    Actually, there is a way to do this in Javascript. I've modified this script from a gallery I did.

    Code:
    <script language="javascript" type="text/javascript">
    //
    // Global variable to keep track of how many popups are open
    //
    var numWinOpen
    //
    // open a window and write the html
    //
    function fnImageOnClick(ndx)
    {
    var opt=new String()
    var strTemp, strTemp2
    // set options for window
    var numWidth=250
    strTemp2="win"+numWinOpen
    strTemp="/popup/"+ndx
    opt="WIDTH="+numWidth+",HEIGHT="+((screen.height>700)?700:575)+",RESIZABLE,LEFT=0,TOP=0"
    // limit number of picture windows open
    if (++numWinOpen>=6) numWinOpen=1
    // make sure it's not open already.  Otherwise focus might not be passed
    if ((picWin[numWinOpen])&&(!picWin[numWinOpen].closed)) picWin[numWinOpen].close()
    // open window, insert HTML
    picWin[numWinOpen]=window.open("", strTemp2, opt)
    with (picWin[numWinOpen])
    	{
    		document.write("<HTML><HEAD></HEAD><BODY BGCOLOR='#000000' LEFTMARGIN='25' TOPMARGIN='25' MARGINWIDTH='25' MARGINHEIGHT='25'>")
    		document.write("<CENTER><TABLE><TR><TD>")
    		document.write("<IMG SRC='"+strTemp+"'>")
    		document.write("</TD></TR></TABLE></CENTER>")
    		document.write("</body></HTML>")
    		document.close()
    	}
    }
    And then for the thumbnail

    Code:
    <a href="javascript:fnImageOnClick('image1.gif')"><img src="images/image1_thumb.gif" border=0></a>
    Does that do ya?


  •  

    Posting Permissions

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