jQuery(document).ready(function($){
  // set up the options to be used for jqDock...
  var dockOptions =
    { align: 'top' // horizontal menu, with expansion DOWN from a fixed TOP edge
    , size: 48 //increase 'at rest' size to 60px
    , labels: true  // add labels (defaults to 'br')
    , setLabel: function(txt, i, el){
        //append a clone of the relevant sub-menu to the label, div.jqDockLabel...
        //Note that I don't need to add the inner wrapper - div.jqDockLabelText - 
        //because I can reposition the sub-menus within div.jqDockLabel itself
        $(el).append($('#submenus>li>ul').eq(i).clone(true))
          //...and intercept mousemoves to prevent propagation and stop
          //the dock resizing as the cursor moves over the sub-menus...
          .bind('mousemove', function(){ 
            return false; 
          })
          //put a one-off mouseenter on every sub-menu to (re)set
          //contained anchor widths...
          .find('ul').one('mouseenter', function(){
            $('>li>a', this).each(function(){
                $(this).width($(this).parent().width());
              });
            return false;
          }).end()
          //for this example, put a click handler on every sub-menu anchor
          //that simply toggles a class to change background colour...
          .find('a').click(function(){
            $(this).toggleClass('clicked');
            this.blur();
            return false;
          })
          //put a hover on any sub-menu LI that has a child menu, to show/hide
          //that child menu; and allow mouseleave to propagate up so that coming
          //completely off the sub-menu structure will still collapse the dock...
          .next('ul').parent().hover(function(ev){
            var mLeave = ev.type == 'mouseleave';
            $('>ul', this)[mLeave ? 'hide' : 'show']();
            return mLeave;
          })
          //add a visual indicator that a child menu exists...
          .find('>a').append("<"+"img src='gfw/bgdropdown.png' alt='' />");
        return false;
      }
    };
  // ...and apply...
  $('#menu').jqDock(dockOptions);
});
