SitePoint Sponsor

User Tag List

Results 1 to 11 of 11

Thread: error onload

  1. #1
    SitePoint Addict Hajduk's Avatar
    Join Date
    Nov 2004
    Location
    Behind you
    Posts
    357
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    error onload

    www.clansunited.net has a scroll box on the top left. All seems to set except it aint working
    I get this error though:

    Line 301
    sign 3
    scrollContent.style is empty or no object
    Code 0

    Now I checked line 301 and it ain empty. As for the rest I am no javascript guru so how in the blue blazes can a guy like me fix this

    Spnx

  2. #2
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    IE is notorious for its bad error messages, indecipherable line numbers and omitted file names.

    Opera's error console provides this information:
    Code:
    Event thread: load
    Error:
    name: TypeError
    message: Statement on line 5: Could not convert undefined or null to object
    Backtrace:
      Line 5 of inline#1 script in http://www.clansunited.net/
        scrollContent.style.top = i;
      Line 1 of  script 
        InitialiseScrollableArea();
    HTH
    Birnam wood is come to Dunsinane

  3. #3
    SitePoint Addict Hajduk's Avatar
    Join Date
    Nov 2004
    Location
    Behind you
    Posts
    357
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ok so if I understand correctly the error is on:
    scrollContent.style.top = i; (line 5)

    But then it tells me that Line 1 of script
    InitialiseScrollableArea();
    At unknown location

    While I call it at <body onLoad="InitialiseScrollableArea();"> of my header. So I dont understand the error...?

  4. #4
    SitePoint Addict Hajduk's Avatar
    Join Date
    Nov 2004
    Location
    Behind you
    Posts
    357
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hmm, I checked and all is case sensitive correct I believe. Or it this not the problem?

  5. #5
    SitePoint Author silver trophybronze trophy

    Join Date
    Nov 2004
    Location
    Ankh-Morpork
    Posts
    12,158
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It seems as if the problem is that the scrollContent object is not set properly. Are you certain that it is properly assigned?
    Birnam wood is come to Dunsinane

  6. #6
    SitePoint Zealot
    Join Date
    Dec 2004
    Location
    Canada
    Posts
    162
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    You have multiple divs all with the id scrollContainer or scrollContent. IDs are meant to be unique. This is completely confusing the browser.

  7. #7
    SitePoint Addict Hajduk's Avatar
    Join Date
    Nov 2004
    Location
    Behind you
    Posts
    357
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    OK changed them into id's and now I get this:

    Clans United
    http://www.clansunited.net/
    Event thread: load
    Error:
    name: ReferenceError
    message: Statement on line 4: Reference to undefined variable: scrollContainer
    Backtrace:
    Line 4 of inline#1 script in http://www.clansunited.net/
    i = scrollContainer.offsetHeight + 10;
    Line 1 of script
    InitialiseScrollableArea();
    At unknown location
    [statement source code not available]

    I think things are properly assigned but then again this shows me that its not but I am unaware on where the error is.....

  8. #8
    SitePoint Zealot
    Join Date
    Dec 2004
    Location
    Canada
    Posts
    162
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The javascript you're running expects there to be a single div on the page called scrollContainer. If you have multiple divs with this ID (as before) or none at all (as now) it will fail.

  9. #9
    SitePoint Addict Hajduk's Avatar
    Join Date
    Nov 2004
    Location
    Behind you
    Posts
    357
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Forgive me for being dense but I still dont get it completely, or at least know how to fix it. My CSS looks like this:

    Code:
    .scrollContainer{
    	position:absolute; 
    	width:176px; 
    	height:209px; 
    	overflow:hidden; 
    	top:71px; 
    	left:147px; 
    	clip:rect(0,320,240,0); 
    	visibility:hidden
    } 
    .scrollContent{
    	font:normal 11px arial;
    	position:absolute;
    	top:0;
    	left:5;
    	cursor:default;
    }	
    .link {
    	text-decoration:none;
    	color:#ffcc00;
    }
    .linkOver {
    	text-decoration:none;
    	color:brown;
    }
    My HTML looks like this:
    Code:
    <script language="JavaScript">
    	var i,c=0,scrl=true;;
    	function InitialiseScrollableArea(){ 
    		i = scrollContainer.offsetHeight+10;	
    		scrollContent.style.top = i;
    		scrollContainer.style.visibility='visible';
    	    scrollContainer.style.left=100;
    		setInterval('ScrollText()',20);
    	}
    	function ScrollText() {
    		if (!scrl) return;
    		scrollContent.style.top=i--;
    		if (scrollContent.offsetHeight < scrollContainer.offsetHeight) {
    			if (i == -scrollContainer.offsetHeight) i = scrollContainer.offsetHeight+10;
    			return;
    		}
    		
    		if (Math.abs(i) > scrollContent.offsetHeight) {
    			i = scrollContainer.offsetHeight+10;	
    		}
    	}
    </script>
    </head>
    <body onLoad="InitialiseScrollableArea();">
    .......

    Code:
     echo "<div class=\"scrollContainer\"> <div class=\"scrollContent\">";
     echo "<br /><a onMouseOver=\"javascript:scrl=false;this.className='linkOver';\" onMouseOut=\"javascript:scrl=true;this.className='link'\" class=\"link\" href=\"phorum/read.php?". $row[forum_id].",".$row[thread].",".$row[message_id]."\">" .$row[subject]. "</a>";
     echo "<br />Posted by ". $row[author];
     echo "<br />in " .$row[name];
     echo"<br />"."";
     echo " ".$row[datestamp]. "<br /><br /><br /><br /></div></div>";
    so what am I doing exactly wrong?

  10. #10
    SitePoint Zealot
    Join Date
    Dec 2004
    Location
    Canada
    Posts
    162
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    To be honest, there are lots of problems.

    You now have divs with the class name scrollContainer, but you don't have an id with that name. Classes and ids are different. Your javascript function expects there to be a div with id=scrollContainer, and will only work on that div.

    Actually, your function wouldn't work anyway, as you can't refer to an id directly like that (scrollContainer.offsetHeight+10). You'd need document.getElementById('scrollContainer').offsetHeight+10. The same applies to all references to ids in your javascript.

    But even making this change, you have no such id anyway.

  11. #11
    SitePoint Addict Hajduk's Avatar
    Join Date
    Nov 2004
    Location
    Behind you
    Posts
    357
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hmm still strange all of this. When running like this on 1 page it works. No errors no quirks nada. So all of this below is wrong? And when I carve it up and put it into my template system because its wrong it stops working?

    Damn, this is harder then I thought, guess I will resort to using Marquee tags then again....

    Code:
    <head>
    <style type="text/css">  
    #divContainer{
    	position:absolute; 
    	width:176px; 
    	height:209px; 
    	overflow:hidden; 
    	top:71px; 
    	left:147px; 
    	clip:rect(0,320,240,0); 
    	visibility:hidden
    } 
    #divContent{
    	font:normal 11px arial;
    	position:absolute;
    	top:0;
    	left:5;
    	cursor:default;
    }	
    .link {
    	text-decoration:none;
    	color:black;
    }
    .linkOver {
    	text-decoration:none;
    	color:brown;
    }
    
    } 
    </style>
    <script language="JavaScript">
    	var i,c=0,scrl=true;;
    	function InitialiseScrollableArea(){ 
    		i = divContainer.offsetHeight+10;	
    		divContent.style.top = i;
    		divContainer.style.visibility='visible';
    	    divContainer.style.left=100;
    		setInterval('ScrollText()',20);
    	}
    	function ScrollText() {
    		if (!scrl) return;
    		divContent.style.top=i--;
    		if (divContent.offsetHeight < divContainer.offsetHeight) {
    			if (i == -divContainer.offsetHeight) i = divContainer.offsetHeight+10;
    			return;
    		}
    		
    		if (Math.abs(i) > divContent.offsetHeight) {
    			i = divContainer.offsetHeight+10;	
    		}
    	}
    </script>
    
    </head>
    
    <body onLoad="InitialiseScrollableArea();">
    <p>Simple DIV News Scroller Sample</p>
    <p>&nbsp; </p>
    <div id="divContainer"> 
      <div id="divContent"> 
    
    <?php
    
    $host  = "localhost";
    $dbuser = "";
    $dbpass = "";
    $dbname = "";
    $table  = "phorum_messages";
    $forum_table ="phorum_forums";
    $number = 15;   // number of messages to show. 
    
    @$con=mysql_connect($host,$dbuser,$dbpass) or die ("cannot connect to MySQL");
    $select_db = mysql_select_db($dbname,$con); 
    $result = mysql_query("select * from $table m, $forum_table f where m.forum_id = f.forum_id order by m.datestamp desc limit $number") or die("Failed Query of " . $result. mysql_error());
    
    while($row = mysql_fetch_array($result)){ 
    $row[datestamp] = strftime($PHORUM["short_date"], $row["datestamp"]);
     
     echo "<br /><a onMouseOver=\"javascript:scrl=false;this.className='linkOver';\" onMouseOut=\"javascript:scrl=true;this.className='link'\" class=\"link\" href=\"phorum/read.php?". $row[forum_id].",".$row[thread].",".$row[message_id]."\">" .$row[subject]. "</a>";
     echo "<br />Posted by ". $row[author];
     echo "<br />in " .$row[name];
     echo"<br />"."";
     echo " ".$row[datestamp]. "<br /><br /><br /><br />";
    }
    
    
    ?>
    
          </div>
    </div>
    
    
    </body>


Bookmarks

Posting Permissions

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