SitePoint Sponsor

User Tag List

Results 1 to 2 of 2

Hybrid View

  1. #1
    SitePoint Member
    Join Date
    Jan 2002
    Posts
    1
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Question How to change an image and pop in another window?



    I have a webpage that has one clothing item with three color swatches. When I click on the diferent color swatch the image changes. This works fine.

    When I click to enlarge the image, it pops a new window of the clothing item larger - static image. This works fine, however, I want the pop-up window to show the color swatch that was selected. I know this can be done, but am lost on how to do this. Maybe an array but how?

    Here's my script for the window pop:


    function changeOption()
    {
    var openwin=window.open('','2010', config='resizable=1,width=410,height=440,top=0,left=75,scrollbars=0')
    openwin.document.write("<html>")
    openwin.document.write("<title>Ladies Model 2010</title>")
    openwin.document.write("<body marginheight='0' marginwidth='0' leftmargin='0' topmargin='0'>")
    openwin.document.write("<center>")
    openwin.document.write("<img src='../images/ladies/2010_sl.jpg' border='0'>")
    openwin.document.write("<br>")
    openwin.document.write("<p>")
    openwin.document.write("<a href='javascript:window.close();'>")
    openwin.document.write("<img src='../images/close.gif' border='0' width='53' height='19'>")
    openwin.document.write("</center>")
    openwin.document.write("</body>")
    openwin.document.write("</html>")

    }
    </Script>

    Here is my script for one of the color swatches:

    <a href="#" onClick="document.img1.src='../images/ladies/2010_sm.jpg'">

  2. #2
    SitePoint Guru Vincent Puglia's Avatar
    Join Date
    Feb 2000
    Location
    where the World once stood
    Posts
    700
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    var imgArray = new Array()
    imgArray[0] = '../images/ladies/2010_sm.jpg'
    imgArray[1] = '../images/ladies/2010_sl.jpg'

    function changeOption(imgSrc)
    {
    var openwin=window.open('','2010',....
    ....
    openwin.document.write("<img src=" + imgArray[imgSrc] + "border='0'>")
    ....
    }

    <a href="#" onClick="document.img1.src=imgArray[0]; changeOptions(1)">

    Vinny
    Where the World Once Stood
    the blades of grass
    cut me still


Bookmarks

Posting Permissions

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