www.webdeveloper.com
Results 1 to 4 of 4

Thread: Debug me!!!

  1. #1
    Join Date
    Aug 2011
    Posts
    7

    Debug me!!!

    Hi all,

    I have the following piece of code that I've been going over in my head for a few hours now and I'm drawing blanks! This is an extended version of a script I found on this site - but I cant see where I'm going wrong!

    JS File:
    Code:
    var num=0;
    
    imgArray = [
      ['voyager.gif','Voyager', '1.2','2','9.2','30','2,900','1,695','4,595','5'],
      ['pioneer.gif','Pioneer','1.6','2.3','11','34','3,500','1,920','5,420','5'],
      ['adventurer.gif','Adventurer','1.5','2.7','11','42','4,100','2,360','6,460','5'],
      ['explorer.gif','Explorer','1.6','3.2','16.5','52','5,500','2,525','8,025','5'],
      ['challenger.gif','Challenger','2.3','3.6','27','45','7,200','2,910','10,110','5']
    ]
    
    function slideshow(slide_num) {
      document.getElementById('boulderimage').src=imgArray[slide_num][0];
      document.getElementById('boulderimage').alt=imgArray[slide_num][1];
      document.getElementById('bouldername').innerHTML=imgArray[slide_num][1];
      document.getElementById('boulderheight').innerHTML=imgArray[slide_num][2];
      document.getElementById('boulderwidth').innerHTML=imgArray[slide_num][3];
      document.getElementById('bouldersqm').innerHTML=imgArray[slide_num][4];
      document.getElementById('boulderfallzone').innerHTML=imgArray[slide_num][5];
      document.getElementById('bouldercost').innerHTML=imgArray[slide_num][6];
      document.getElementById('bouldermatcost').innerHTML=imgArray[slide_num][7];
      document.getElementById('bouldertotalcost').innerHTML=imgArray[slide_num][8];
      document.getElementById('boulderwarranty').innerHTML=imgArray[slide_num][9];
    }
    
    function slideshowUp() {
      num++;
      num = num % imgArray.length;
      slideshow(num);
    }
    
    function slideshowBack() {
      num--;
      if (num < 0) {num=imgArray.length-1;}
      num = num % imgArray.length;
      slideshow(num);
    }
    HTML File:
    Code:
    <html><head></head><body>
    <script type="text/javascript" src="jsImageScroller.js"></script>
    
    <div style="text-align: center">
    
    	<table>
    		
    		<tr>
    			<td colspan="6"><div name="BoulderName">Voyager</div></td>
    		</tr>
    		
    		<tr>
    			<td>Height (m): </td>
    			<td><div id="boulderheight">1.2</div></td>
    			<td>Width (m): </td>
    			<td><div id="boulderwidth">2</div></td>
    			<td>Total Sqm: </td>
    			<td><div id="bouldersqm">9.2</div></td>
    		</tr>
    		
    		<tr>
    			<td colspan="2">Fall Zone Required (Sqm)</td>
    			<td><div id="boulderfallzone">30</td>
    		</tr>
    		
    		<tr>
    			<td colspan="6">Costs:</td>
    		</tr>
    		
    		<tr>
    			<td>Boulder: </td>
    			<td><div id="bouldercost">2,900</div></td>
    			<td>Safety Matting: </td>
    			<td><div id="bouldermatcost">1,695</div></td>
    			<td>Total Cost: </td>
    			<td><div id="bouldertotalcost">4,595</div></td>
    		</tr>
    		
    		<tr>
    			<td colspan="2">Warranty Period (years): </td>
    			<td><div id="boulderwarranty">5</td>
    		</tr>
    	</table>
    	
    </div>
    			
    
      <!--  Place the first image here  -->
     <img src="pix1-sm.gif" id="boulderimage" name="boulderimage" alt="information" border="0" height="150" width="200">
    
      <a href="#" onclick="slideshowBack(); return false;"><< Previous</a> |
      <a href="#" onclick="slideshowUp(); return false;"> Next >></a>
    </div>
    Please help me figure out why the images update, but none of the text does when clicking back and next!

    Ben

  2. #2
    Join Date
    Aug 2011
    Posts
    7
    Sorry to double post!!

    Quick note: I know the script call should ideally be in the head tag, but this is going into a CMS that doesn't allow me access to the page head! - so this'll have to do until I can move away from the CMS next year.

  3. #3
    Join Date
    Apr 2006
    Location
    Perth
    Posts
    154
    Code:
    <td colspan="6"><div id="bouldername">Voyager</div></td>
    This object has no ID, only a NAME attribute. And the NAME was wrong too. Names and
    ID's are case sentitive.
    Colin Fiat Simple Solutions To Complex Problems

  4. #4
    Join Date
    Aug 2011
    Posts
    7
    Thankyou so much! This has been doing my head in for nearly 4 hours now and its so obvious once you see it!

    Your an absolute star!

    Thankyou!

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles