http://www.sws.vxcomputers.com/h2k/
Basically, on the left, you'll see a roster (them images) and you have to click the "Counter-Strike" link for it to load the images/names. However, I overcome this by executing what is usually the OnClick event on the OnLoad event instead. This works great in firefox - meaning there is no need to click the link to see the
proper images and not the filler images - it just comes up straight away like that.
However, when I added this onload event I get an error in IE7 - and I am still required to click the link to see the images/names. Here is the error:
Line: 54
Char: 19
Error: '_rosterlists' is null or not an object
Code: 0
URL: http://www.sws.vxcomputers.com/h2k/index.php
Ive tried numerous things like positioning what was the OnClick event at the end of the page etc...none work. Is there a way to check that the page is fully loaded? Also my index.php includes header.php, then the content then footer.php. So maybe header.php could check if footer.php is loaded then execute the javascript?
I tried putting the javascript code in footer.php (not the same file whereby the main code is for the roster section) and that has no effect in either browser.
Here is the code in header.inc.php:
[HTML]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title><?php echo $website_title; ?></title>
<meta name="Author" content="(c) 2003/2004 ">
<meta http-equiv="imagetoolbar" content="no">
<meta http-equiv="content-type" content="text/html;charset=UTF-8">
<link rel="StyleSheet" href="css/smt8.css">
<script type="text/javascript" src="css/sortable.js"></script>
<style type="text/css">
/* Sortable tables */
table.sortable a.sortheader {
cursor: hand;
cursor: display;
}
table.sortable span.sortarrow {
color: black;
font-weight: bold;
text-decoration: none;
display: none;
}
</style>
<script type="text/javascript" src="css/scripts.js"></script>
</head>
<body onLoad="_active = 'roster-css'; updateLists(); return false">
<div id="container">
<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,0,0" width="959" height="215" id="header" style="display: block;">
<param name="allowScriptAccess" value="sameDomain" />
<param name="movie" value="header.swf" />
<param name="quality" value="high" />
<param name="bgcolor" value="#bbbbbbb" />
<embed SRC="header.swf" QUALITY="high" BGCOLOR="#ffffff" WIDTH="959" HEIGHT="215" NAME="header" ALLOWSCRIPTACCESS="sameDomain" TYPE="application/x-shockwave-flash" PLUGINSPAGE="http://www.macromedia.com/go/getflashplayer" STYLE="display: block;">
</object>
<div id="rightContent">
<h1 class="teamRoster"></h1>
<div id="rosterheading">
<div id="rosterlinks">
<?php
$games = getRosterGames();
$count = count($games);
foreach ($games as $i => $game) {
list($short, $full) = $game; ?>
<a href="#" onClick="_active = 'roster-<?= $short ?>'; updateLists(); return false"><?= $full ?></a> <?php if ($i + 1 != $count) { ?> | <?php } ?>
<?php } ?>
</div>
</div>
<?php foreach (getRosterLists() as $i => $filename) { ?>
<ul id="<?= basename($filename, '.txt') ?>" style="display: <?= ($i == 0 ? 'block' : 'none') ?>;" class="rosterlist">
<?php getTXT(basename($filename, '.txt')); ?>
</ul>
<?php } ?>
<br style="clear: both;" />
<a href="roster.php" class="more roster"></a>
<h1 class="latestmedia"></h1>
<ul>
<?php getTXT("media"); ?>
</ul>
<a href="roster.php" class="more latestmedia"></a>
<h1 class="quicklinks"></h1>
<ul>
<?php getTXT("links"); ?>
</ul>
<a href="links.php" class="more latestmedia"></a>
</div>
<div id="mainContent">
<h1 class="mainContent"></h1>
[/HTML]
The stuff regarding the roster section is the bit starting with "$games = getRosterGames();"
And here is the JS file that is included (you'll notice it mentions more than 1 but the other is irrelevant):
Expand|Select|Wrap|Line Numbers
- addEvent(window, "load", rosterlist_fix);
- var _rosterlists;
- var _active;
- function rosterlist_fix() {
- var lists = document.getElementById('rightContent').getElementsByTagName('ul');
- var list;
- var rosterlists = new Array();
- for (var i = 0; list = lists[i]; i++) {
- if (list.className == 'rosterlist')
- rosterlists[rosterlists.length] = list;
- }
- _rosterlists = rosterlists;
- _active = _rosterlists[0].id;
- updateLists();
- }
- function updateLists() {
- var ul;
- for (var i = 0; ul = _rosterlists[i]; i++) {
- if (ul.id != _active)
- ul.style.display = 'none';
- else
- ul.style.display = 'block';
- }
- }
Help?!!
I just need "_active = 'roster-css'; updateLists(); return false" to load when the page is done loading - but IE isn't liking it in OnLoad!