[thelist] Moving Menu Items

Jay Turley jayturley at gmail.com
Tue Mar 24 13:23:52 CDT 2009


If you're using jQuery it's very easy to do everything you want
(caution code written off top of head) - with the exception of the
moving to the top of the list:

<style type="text/css">
  .contentSection { display: none; }
</style>

<ul>
  <li><a href="#" rel="section1" class="contentSectionTrigger">Section
1</a></li>
  <li><a href="#" rel="section2" class="contentSectionTrigger">Section
2</a></li>
</ul>
<div id="section1" class="contentSection">Section 1 content goes here</div>
<div id="section1" class="contentSection">Section 1 content goes here</div>

<script type="text/javascript">
  $(document).ready( function() {
    $('.contentSectionTrigger').live('click', function () {
      // using live() instead of click() in case you reload UL through ajax
      var currContentSection = $(this).attr('rel');
      // hide all content then show selected section
      $('.contentSection').hide();
      $('#'+currContentSection).show();
    });
  });
</script>

On Tue, Mar 24, 2009 at 10:43 AM, j s <jslist at sbcglobal.net> wrote:
>
> Yes I was trying to talk him into the accordian style or the tree style.  But the boss is always right :-(  especially in this job mkt....
>
> There's nothing like what I was talking about in AJAX - is there?
>
>
> ----- Original Message ----
> From: ben morrison <morrison.ben at gmail.com>
> To: "thelist at lists.evolt.org" <thelist at lists.evolt.org>
> Sent: Tuesday, March 24, 2009 12:14:05 PM
> Subject: Re: [thelist] Moving Menu Items
>
> On Tue, Mar 24, 2009 at 4:59 PM, j s <jslist at sbcglobal.net> wrote:
>
>>
>> No Ben not April 1st.  Just a boss that came up with a little idea.  The
>> dept that gets clicked turns a different color - indicating which dept
>> that's been clicked.  Then all the sublinks in that department show up
>> below.  This company's employees are mostly +55.  And they don't want fly
>> out menus.
>
>
> Yikes I think thats worse, they'll be even more confused.
>
> Never mind, back to the question flash/javascript?
>
> Most Navs use a tree-view like structure:
>
> http://developer.yahoo.com/yui/examples/treeview/customicons.html
>
> There are also Accordion menus:
>
> http://www.dynamicdrive.com/dynamicindex17/ddaccordionmenu.htm
>
> Yours is a little different  - this could be handled with some extra JS and
> CSS if you know whee to begin . . ..
>
> Ben
> --
> Ben Morrison
> --
>
> * * Please support the community that supports you.  * *
> http://evolt.org/help_support_evolt/
>
> For unsubscribe and other options, including the Tip Harvester
> and archives of thelist go to: http://lists.evolt.org
> Workers of the Web, evolt !
>
> --
>
> * * Please support the community that supports you.  * *
> http://evolt.org/help_support_evolt/
>
> For unsubscribe and other options, including the Tip Harvester
> and archives of thelist go to: http://lists.evolt.org
> Workers of the Web, evolt !
>



More information about the thelist mailing list