1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Nov 2012
    Rep Power

    Problem with duplicate icons

    I have a code

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
     <html xmlns="http://www.w3.org/1999/xhtml">
     <title>Image Change Demo</title>
     <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
     <script type="text/javascript">
     function changeIt(objName)
     //The image object accessed through its id we mentioned in the DIV block which is going to be visible currently
     var obj = document.getElementById(objName);
     //An array that hold the IDs of images that we mentioned in their DIV blocks
     var objId = new Array();
     //Storing the image IDs into the array starts here
     objId[0] = "image1";
     objId[1] = "image2";
     objId[2] = "image3";
     objId[3] = "image4";
     objId[4] = "image5";
     //Storing the image IDs into the array ends here
     //A counter variable going to use for iteration
     var i;
     //A variable that can hold all the other object references other than the object which is going to be visible
     var tempObj;
     //The following loop does the display of a single image based on its ID. The image whose ID we passed into this function will be the
     //only image that is displayed rest of the images will be hidden based on their IDs and that part has been handled by the else part
     //of the if statement within this loop.
     if(objName == objId[i])
     obj.style.display = "block";
     tempObj = document.getElementById(objId[i]);
     tempObj.style.display = "none"; 
     <div id="image1">
     <img src="1.jpg" border="0" alt="one" />
    <div id="image2" style="display:none">
     <img src="2.jpg" border="0" alt="two" />
    <div id="image3" style="display:none">
     <img src="3.jpg" border="0" alt="three" />
    <div id="image4" style="display:none">
     <img src="4.jpg" border="0" alt="four" />
    <div id="image5" style="display:none">
     <img src="5.jpg" border="0" alt="five" />
     <a id="one" href="#" onclick="changeIt('image1');">one</a>
     <a id="two" href="#" onclick="changeIt('image2');">two</a>
     <a id="three" href="#" onclick="changeIt('image3');">three</a>
     <a id="four" href="#" onclick="changeIt('image4');">four</a>
     <a id="five" href="#" onclick="changeIt('image5');">five</a>
    My problem is - I have an icon, and after clicking on it i want it to return two pictures in two different areas on the screen ( same pictures but double )
    Is it possible ?
    how do i do it
  2. #2
  3. Java Junkie
    Devshed Specialist (4000 - 4499 posts)

    Join Date
    Feb 2004
    Mobile, Alabama
    Rep Power
    You need to ask this in the Javascript forum.

IMN logo majestic logo threadwatch logo seochat tools logo