Try this if you can't change your html

(function($) {
  $.fn.replaceClass = function(class1, class2){
                $(this).removeClass(class1).addClass(class2);
  }
})(jQuery);


$('.nav_company').hoverIntent(function() {
    // toggle display of company sub menu content panel
    $
('.nav_sub_default, .nav_sub_products, .nav_sub_markets, 
.nav_sub_tools_support, .nav_sub_news_events').replaceClass
('onscreen', 'offscreen');
    $('.nav_sub_company').replaceClass('offscreen', 'onscreen');

  },

  function(){
    return false;
  }
);

On Jan 13, 8:36 am, "r...@lighthouseuk.net" <r...@50-tuning.com>
wrote:
> Hi,
> I'm new to jQuery and liking what I've seen so far.
>
> I'm curious as to whether I can reduce my code, using chaining
> perhaps?
>
> Example...
>
> $('.nav_company').hoverIntent(function() { // toggle display of
> company sub menu content panel
>         $('.nav_sub_default').removeClass('onscreen').addClass
> ('offscreen');
>         $('.nav_sub_company').removeClass('offscreen').addClass
> ('onscreen');
>         $('.nav_sub_products').removeClass('onscreen').addClass
> ('offscreen');
>         $('.nav_sub_markets').removeClass('onscreen').addClass
> ('offscreen');
>         $('.nav_sub_tools_support').removeClass('onscreen').addClass
> ('offscreen');
>         $('.nav_sub_news_events').removeClass('onscreen').addClass
> ('offscreen');
>       },function(){
>         return false;
>
> });
>
> Based on the fact that there are 6 menu items (nav_sub_x) - I
> currently have the above code entered 6 times to add and remove the
> necessary classes from each of the relevant DIVs on the page.
>
> Is there a cleaner way to do this?
> Many thanks in advance.
> Cheers,
> Rob

Reply via email to