images don't switch

Discussion in 'JavaScript' started by gilgalbiblewheel, Aug 14, 2007.

  1. #1
    Can someone tell me where I've gone wrong in the following code?

    I get:
    <script type="text/javascript" language="javascript1.3">
    	function toggle(id){
    		ol = "ol_" + id;
    		img = "img_" + id;
    		olElement = document.getElementById(ol);
    		imgElement = document.getElementById(img);
    		if (olElement){
    			if (olElement.className == 'closed'){
    				olElement.className = "open";
    				[COLOR="Red"][B]imgElement[/B][/COLOR].src = "images/opened.gif";
    				}else{
    				olElement.className = "closed";
    				[COLOR="Red"][B]imgElement[/B][/COLOR].src = "images/closed.gif";
    				}
    			}
    		}
    </script>
    
    <td>
    	<a  onclick="toggle('item6');">	
    		<h5><img src="images/closed.gif" alt="Click to Expand" id="img_item1" border="0" /> TOP 4 SELF-HELP BOOKS</h5>
    	</a>	
    	<ol type="1" id="ol_item6" class="closed">
    		<li id="item6_1"><a href="">Feeling Good</a></li>
    		<li id="item6_2"><a href="">Resilience</a></li>
    		<li id="item6_3"><a href="">Allies in Healing</a></li>
    		<li id="item6_4"><a href="">The Dance of Anger</a></li>
    	</ol>
    </td>
    Code (markup):
     
    gilgalbiblewheel, Aug 14, 2007 IP
  2. gilgalbiblewheel

    gilgalbiblewheel Well-Known Member

    Messages:
    435
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    101
    #2
    I'll answer my own question: Because I haven't changed the img id to 6 from one.
    <a  onclick="toggle('item[B][COLOR="Red"]6[/COLOR][/B]');">	
    		<h5><img src="images/closed.gif" alt="Click to Expand" id="img_item[B][COLOR="Red"]1[/COLOR][/B]" border="0" /> TOP 4 SELF-HELP BOOKS</h5>
    	</a>
    Code (markup):
    When I changed it, it worked.
     
    gilgalbiblewheel, Aug 14, 2007 IP
  3. Wildhoney

    Wildhoney Active Member

    Messages:
    192
    Likes Received:
    7
    Best Answers:
    0
    Trophy Points:
    58
    #3
    Give yourself a rep!
     
    Wildhoney, Aug 14, 2007 IP
  4. koldfyre

    koldfyre Peon

    Messages:
    5
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #4
    Hmm, your code is pretty nice. I like how you used the class to check whether something was opened or closed. When I first needed something like that, I used variables first and then went to just checking the style of the object directly.
    Something like this:
    
    if(this.style.visibility=="visible"){
        this.style.visibility="hidden";
    }
    
    Code (markup):
    and then I learned about ternary operators and did something like this:
    
    (this.style.visibility=="visible") ? (this.style.visibility="hidden") : (this.style.visibility="visible");
    
    Code (markup):
    Ed
     
    koldfyre, Aug 15, 2007 IP
  5. gilgalbiblewheel

    gilgalbiblewheel Well-Known Member

    Messages:
    435
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    101
    #5
    Is there a tutorial on that?

    Yeah sometimes I feel so braindead in front of the computer that I don't see the problem right away.

    Especially the error "has no properties" leaves me scratching my head and looking everywhere saying what's causing this?
     
    gilgalbiblewheel, Aug 15, 2007 IP