Graham
Waplocus There are many ways to do it
this is just a very simple solution
http://auldphart.yn.lt/000ls
<script>
function first(){
document.getElementById('main').innerHTML='<b>The first page</b>';
}
function second(){
document.getElementById('main').innerHTML='<b>The second page</b>';
}
function third(){
document.getElementById('main').innerHTML='<b>The third page</b>';
}
</script>
<div class="top_nav"><button onclick="first()"> first </button> <button onclick="second()"> second </button> <button onclick="third()"> third </button></div>
<div id="main"><b>Main page</b></div>
<div class="bottom_nav">This does not change</div>
Copy code
When you click a button the contents of 'main' are replaced by the function result
