tree view navigation - results of content on the right.

A

annettem

I would like to have a tree view navigation on the left border of a
page where when a user clicks on a topic, it expands and shows the
content within the topic. Then if someone clicks the underlying topic,
it will appear on the right (middle of the screen) -- at the same time
keeping the tree view to the left.

This would be helpful with such things as navigating through a
handbook.

I have tried working with DHTML's and can get a tree view, but do not
know how to get it to be on the left side and never move, while the
contents display on the right.

Any ideas?

Thank you!
 
T

Trevor Lawrence

One thought is to use an absolutely positioned <iframe>

Here is a quick example modified from my site where the iframe contains a
news page

You would need to replace the button with the drop down menu whose entries
are
onclick = ''topic1.html" etc

You may also need to adjust the position of #News.

<html>
<head>
<style type="text/css">
body {margin: 0;}
#News {position: absolute; left: 20%;
height: 100%; width: 80%;
display: none;
background : red}
</style>
<script type="text/javascript">
function loadIframe(sPath) {
var x = document.getElementById("News")
if (x.style.display != 'block') {
x.src = sPath
x.style.display = 'block'
}
else
x.style.display = 'none'
}
</script>
</head>

<body>
<button onclick="loadIframe('news.html')" title="Open/Close">
Open/Close</button>
<iframe id="News"></iframe>
</body>
</html>
 
T

Trevor Lawrence

Trevor Lawrence said:
One thought is to use an absolutely positioned <iframe>

Here is a quick example modified from my site where the iframe contains a
news page

BTW, Scrub this:
background : red

I was just experimenting and I forgot to remove it
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Top