How do i make multiple links change 1 Div?

Question

I'm not sure how to go about explaining this but ill try.
i have a my main nav bar on top with my links to pages i go to a page say "products" on the products page theyre 8 links on the side and a big DIV space to the right that i would like to change with each click on its respectable link. can i just make the big Content DIV change? or do i have to make a page for each link. sorry if that vague if you have any questions just ask me thanks.

Answer 1

Hi
Sorry if I put you off but it is not as complicated as it may appear from the tutorials. As an example once you have your pages created and using jQuery, to place the content into your 'existing page you would use the following code -
<script type="text/javascript" charset="utf-8">
//<![CDATA[          // new code
  // When the document loads do everything inside here ...
$(document).ready(function(){
                        $('.menu a').click(function(event) { //start function when any link is clicked
                        event.preventDefault();
                        var content_show = $(this).attr('href'); //retrieve title of link so we can compare with file
                            $.ajax({
                            method: 'get',url: content_show,
                            error: function(){
                            $('#detailcontent').html('<h3>Error loading document!</h3>');
                           success: function(){ //so, if data is retrieved, store it in html
                           //$("#detailcontent").html("Your item no is - " +content_show); //reinsert for testing
                           $("#detailcontent").load(content_show + ' ' + '#detailcontent'); //show the html inside detailcontent div
          }); //close click(
     }); //close $(
//]]>
  </script>
This would insert the content from a div with an id of detailcontent in your 'link' page and place it into your 'current' pages div with the same name.
PZ