Click to See Complete Forum and Search --> : Loading New Info, Into a Table, Without Frames


secaves
06-05-2006, 01:51 AM
What I'm thinking of seems impossible, but I'm hoping the HTML Gurus can help me out here.


I'm looking to create a table, with links at the top, Using only html, and the links load new info into said table.

Now heres the real trick, I only have one page to work with, so Using frames to load in the other page won't work.

I have a theory, but I've been stopped short.

If I use a Div code to make the table scrolling, and hyper links to get to the info it might work. But I don't want people to be able to scroll on their own, I want to stop the scrolling process unless they click the hyperlink.

Seems like the long way to go about it, but I can't really think of another feasable way.


Also, belive it or not, it's for a MySpace, thus only having one page. I have way to much content and I'd like to have it in a nice little box, so you only have to see what you choose to see, see? Wait a minute.. Um Yea. Anyways thanks in advance for any advice.

NogDog
06-05-2006, 02:51 AM
Something like this?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang='en'>
<head>
<meta http-equiv='Content-Type' content='text/html; charset=ISO-8859-1'>
<title>Page Title</title>
<style type="text/css">
#nav {
list-style: none;
margin: 0 0 20px 0;
padding: 0;
}
#nav li {
display: inline;
padding: 0 2em 0 0;
}
#content {
height: 14em;
overflow: auto;
border: inset 2px gray;
}
</style>
</head>
<body>

<ul id="nav">
<li><a href="#part1">Part 1</a></li>
<li><a href="#part2">Part 2</a></li>
<li><a href="#part3">Part 3</a></li>
</ul>

<div id="content">
<h2 id="part1">Part One</h2>
<p>This is a test. It is only a test.</p>
<p>This is a test. It is only a test.</p>
<p>This is a test. It is only a test.</p>
<p>This is a test. It is only a test.</p>
<p>This is a test. It is only a test.</p>
<p>This is a test. It is only a test.</p>

<h2 id="part2">Part Two</h2>
<p>This is a test. It is only a test.</p>
<p>This is a test. It is only a test.</p>
<p>This is a test. It is only a test.</p>
<p>This is a test. It is only a test.</p>
<p>This is a test. It is only a test.</p>
<p>This is a test. It is only a test.</p>

<h2 id="part3">Part Three</h2>
<p>This is a test. It is only a test.</p>
<p>This is a test. It is only a test.</p>
<p>This is a test. It is only a test.</p>
<p>This is a test. It is only a test.</p>
<p>This is a test. It is only a test.</p>
<p>This is a test. It is only a test.</p>
</div> <!-- content -->

</body>
</html>

secaves
06-05-2006, 03:43 AM
Yea that will work, but is their any way to place higth and width values on the box?

NogDog
06-05-2006, 04:28 AM
Yea that will work, but is their any way to place higth and width values on the box?
In the #content portion of the <style> block. For example, if you want it 600 pixels wide by 400 pixels high:

#content {
width: 600px;
height: 400px;
overflow: auto; /* this is what causes scrollbar to display if needed */
}