Harvard Extension School
CSCI E-12 Fundamentals of Web Site Development | Fall 2019

## Pages from Parts and Clamshell Navigation

- Set "iamhere" id
- Close all nested lists
- Show parents of "iamhere"
- Show children of "iamhere"

    <script type="text/javascript">
    $(document).ready(function(){
      console.log("Ready!");
      var mybodyid = $('body').attr('id');
      var mynavid = '#nav_' + mybodyid;
      console.log("mybodyid is " + mybodyid);
      console.log("mynavid is " + mynavid);
      // Set iamhere id
      $(mynavid).attr('id','iamhere');
      // hide all nested lists
      $('#navigation ul ul').hide();
        // show parents of "iamhere"
      $('#iamhere').parents().show();
      // show children of "iamhere"
      $('#iamhere').children().show();
    });
    </script>

### JSFiddle Example

Note for the JSFiddle example, we are using a 'div' to contain the 'id' instead of the 'body'.
Clamshell Navigation in JS Fiddle

### Files

- test.html
- style.css

Copyright © David Heitmeyer