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

    Join Date
    Nov 2012
    Posts
    2
    Rep Power
    0

    Problem with duplicate icons


    I have a code

    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">
     <head>
     <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.
     for(i=0;i<objId.length;i++)
     {
     if(objName == objId[i])
     {
     obj.style.display = "block";
     }
     else
     {
     tempObj = document.getElementById(objId[i]);
     tempObj.style.display = "none"; 
    }
     }
     return; 
    }
     </script>
     </head>
     
    <body>
     <div id="image1">
     <img src="1.jpg" border="0" alt="one" />
     </div>
     
    <div id="image2" style="display:none">
     <img src="2.jpg" border="0" alt="two" />
     </div>
     
    <div id="image3" style="display:none">
     <img src="3.jpg" border="0" alt="three" />
     </div>
     
    <div id="image4" style="display:none">
     <img src="4.jpg" border="0" alt="four" />
     </div>
     
    <div id="image5" style="display:none">
     <img src="5.jpg" border="0" alt="five" />
     </div>
     <br><br>
     <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>
     </body>
     </html>
    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
    Location
    Mobile, Alabama
    Posts
    4,022
    Rep Power
    1285
    You need to ask this in the Javascript forum.

IMN logo majestic logo threadwatch logo seochat tools logo