Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2
  1. #1
    New Coder
    Join Date
    Oct 2005
    Posts
    61
    Thanks
    12
    Thanked 0 Times in 0 Posts

    css left/right dynamic

    Hello,

    need help with the below type of css.
    when i click on left menu, it dynamically changes on the right..

    i know, it will have 4 div layers and master div layer
    and tab1, tab2, tab3 etc..

    but more help in detail on how to achieve this would be appreciated, and thats where i need help with.
    thank you in advance.


  • #2
    Regular Coder
    Join Date
    Jul 2012
    Location
    London
    Posts
    473
    Thanks
    4
    Thanked 86 Times in 86 Posts
    Use a jQuery Content Switcher

    Something like this.

    Code:
    <ul id="navigation">
    <li><a href="#" data-id="one">1</a></li>
    <li><a href="#" data-id="two">2</a></li>
    </ul>
    <div id="one" class="page">
     Put content here...
    </div>
    <div id="two" class="page">
     Put content here...
    </div>
    
    <script>
    
    $(function(){
      $("#navigation").find("a").click(function(e){
        e.preventDefault();
        var id = $(this).attr("data-id"); //get id for the page you wanna show
        $(".page").hide(); //hide all pages with content could use fadeOut or something 
        $("#" + id).fadeIn();  //fade in the page you wanna show
    
       });
    });
    
    </script>

  • Users who have thanked tempz for this post:

    pagedrop (07-31-2012)


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •