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 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Oct 2008
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    How can I loop images object ?

    Hi,

    I would like to know,can I loop images by getElementById() method ?

    Here is my code.It cant execute.

    function SwitchMenu(obj){
    for(i=0; i<obj ; i++ )
    {
    var img = document.getElementById('bullet'+(i));
    img.src = "images/plus.jpg"
    }

    Thank you so much.

    -------------------------------------------------------------------
    Actually, I try to do the switch menu.
    Here is all code.

    Javascript :

    function SwitchMenu(obj){
    var el = document.getElementById(obj);
    var ar = document.getElementsByTagName("span");
    var img = document.getElementById('bullet'+(obj));
    if(el.style.display != "block"){
    for (var i=0; i<ar.length; i++){
    if (ar[i].className=="submenu")
    ar[i].style.display = "none";
    img.src="images/extend.jpg";
    }
    el.style.display = "block";
    }else{
    el.style.display = "none";
    img.src="images/normal.jpg";
    }
    }

    Html :

    <div onclick="SwitchMenu('sub1')" class="toggle" ><img src="images/normal.jpg" border="0" name="bullet1" id="bulletsub1" />&nbsp;CARD &amp; TABLE GAMES</div>
    <span class="submenu" id="sub1">
    <a href="gameA01_en.asp"> gameA01</a>
    <a href="gameA02_en.asp">gameA02</a><br />
    <a href="gameA03_en.asp">gameA03</a><br />
    <a href="gameA04_en.asp">gameA04</a><br />
    </span>

    <div onclick="SwitchMenu('sub2')" class="toggle" ><img src="images/normal.jpg" border="0" name="bullet1" id="bulletsub2" />&nbsp;CARD &amp; TABLE GAMES</div>
    <span class="submenu" id="sub1">
    <a href="gameB01_en.asp"> gameB01</a>
    <a href="gameB02_en.asp">gameB02</a><br />
    <a href="gameB03_en.asp">gameB03</a><br />
    <a href="gameB04_en.asp">gameB04</a><br />
    </span>

    <div onclick="SwitchMenu('sub3')" class="toggle" ><img src="images/normal.jpg" border="0" name="bullet1" id="bulletsub3" />&nbsp;CARD &amp; TABLE GAMES</div>
    <span class="submenu" id="sub1">
    <a href="gameC01_en.asp"> gameC01</a>
    <a href="gameC02_en.asp">gameC02</a><br />
    <a href="gameC03_en.asp">gameC03</a><br />
    <a href="gameC04_en.asp">gameC04</a><br />
    </span>

    Everything is fine but the swap images got a problem. When I clicked another link the image isn't swap.
    I have to clicked itself to let it swap. Which way can I fix ?

    Thank you for your help.
    Last edited by Nuttasit; 10-21-2008 at 04:07 AM. Reason: More Data

  • #2
    Kor
    Kor is offline
    Red Devil Mod Kor's Avatar
    Join Date
    Apr 2003
    Location
    Bucharest, ROMANIA
    Posts
    8,478
    Thanks
    58
    Thanked 379 Times in 375 Posts
    Insufficient data. Can we see the HTML as well? What do you mean by "loop images"?
    KOR
    Offshore programming
    -*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*-*

  • #3
    Senior Coder rnd me's Avatar
    Join Date
    Jun 2007
    Location
    Urbana
    Posts
    4,375
    Thanks
    11
    Thanked 592 Times in 572 Posts
    you are missing "}{":

    Code:
    function SwitchMenu(obj){
    var el = document.getElementById(obj);
    var ar = document.getElementsByTagName("span");
    var img = document.getElementById('bullet'+(obj));
    if(el.style.display != "block"){
    for (var i=0; i<ar.length; i++){
    if (ar[i].className=="submenu"){
      ar[i].style.display = "none";
      img.src="images/extend.jpg";
      el.style.display = "block";
    }else{
      el.style.display = "none";
      img.src="images/normal.jpg";
    }//end if
    }//next
    
    }//end function
    my site (updated 13/9/26)
    BROWSER STATS [% share] (2014/9/03) IE7:0.1, IE8:4.6, IE11:9.1, IE9:3.1, IE10:3.0, FF:17.2, CH:46, SF:11.4, NON-MOUSE:38%


  •  

    Posting Permissions

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