tab separated news content

shout it · #1 (**permalink**) 09-26-08, 03:46 PM

I have got some code for a news display table. the top row contains the link eg, us news uk news business news sport weather etc.
the row below will such the content of the click link.
I am having a problem when the page loads it show the hyperlinks but no content, what i am trying to do is to have one of the links content displayed when the page is loaded eg when the page loads the us news content will be displayed by default. the code i have used is given below::

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta content="text/html; charset=ISO-8859-1" http-equiv="content-type">
<title>Hidden DIVs</title>
<style type="text/css">
.news {
display: none;
}
</style>
<script type="text/javascript">
function hideSections() {
document.getElementById('news-us').style.display='none';
document.getElementById('news-uk').style.display='none';
document.getElementById('news-africa').style.display='none';
}
function showNews(section) {
hideSections();
newsItem = document.getElementById('news-'+section);
if (newsItem) {
newsItem.style.display='block';
}
}
</script>
</head>
<body>
<table style="text-align: left; width: 100%;" border="2" cellpadding="2" cellspacing="2">
<tbody>
<tr>
<td style="text-align: center;"><a onclick="showNews('us');" href="#">US News</a></td>
<td style="text-align: center;"><a onclick="showNews('uk');" href="#">UK News</a></td>
<td style="text-align: center;"><a onclick="showNews('africa');" href="#">Africa News</a></td>
</tr>
<tr>
<td colspan="3">
<div class="news" id="news-us">
<p>This is the news from the US:</p>
<p>The economy is in SERIOUS trouble!  Yikes!!!!!</p>
</div>
<div class="news" id="news-uk">
<p>This is the news from the UK:</p>
<p>Jaguar Motorcars unveils a stunning new Jag today.</p>
</div>
<div class="news" id="news-africa">
<p>This is the news from Africa:</p>
<p>The Pharoahs have returned to build a new, state of the
art pyramid.</p>
</div>
</td>
</tr>
</tbody>
</table>
</body>
</html>Peace...

thanks for looking any help to have one of the links content as displayed content on page load up will be gratefull accepted

s1yfa · #2 (**permalink**) 10-12-08, 03:29 PM

if you want a particular div to show itself when you load the page, you need to say so in the code.

simple replace your opening <body> with

HTML Code:

<body onLoad="showNews('us');">