http://www.lecole-hs.jp/common/js/menu-dropdown.js

1/*
2  jQuery MegaMenu Plugin
3  Author: GeekTantra
4  Author URI: http://www.geektantra.com
5*/
6var isIE6 = navigator.userAgent.toLowerCase().indexOf('msie 6') != -1;
7
8jQuery.fn.megamenu = function(options) {
9  options = jQuery.extend({
10                              activate_action: "mouseover",
11                              deactivate_action: "mouseleave",
12                              show_method: "slideDown",
13                              hide_method: "slideUp",
14                              justify: "left",
15                              enable_js_shadow: true,
16                              shadow_size: 3,
17                              mm_timeout: 250
18                          }, options);
19  var $megamenu_object = this;
20  if( options.activate_action == "click" ) options.mm_timeout = 0;
21  $megamenu_object.children("li").each(function(){
22    jQuery(this).addClass("mm-item");
23    jQuery(".mm-item").css({ 'float': options.justify });
24    
25    jQuery(this).find("div:first").addClass("mm-item-content");
26    jQuery(this).find("a:first").addClass("mm-item-link");
27    var $mm_item_content = jQuery(this).find(".mm-item-content");
28    var $mm_item_link = jQuery(this).find(".mm-item-link");
29    $mm_item_content.hide();
30    
31    jQuery(document).bind("click", function(){
32      jQuery(".mm-item-content").hide();
33      jQuery(".mm-item-link").removeClass("mm-item-link-hover");
34    });
35    jQuery(this).bind("click", function(e){
36      e.stopPropagation();
37    });
38    $mm_item_content.wrapInner('<div class="mm-content-base"></div>');
39    if(options.enable_js_shadow == true) {
40      $mm_item_content.append('<div class="mm-js-shadow"></div>');
41    }
42    var $mm_timer = 0;
43    // Activation Method Starts
44    jQuery(this).bind(options.activate_action, function(e){
45      e.stopPropagation();
46      var mm_item_link_obj = jQuery(this).find("a.mm-item-link");
47      var mm_item_content_obj = jQuery(this).find("div.mm-item-content");
48      clearTimeout($mm_timer);
49      $mm_timer = setTimeout(function(){ //Emulate HoverIntent
50        mm_item_link_obj.addClass("mm-item-link-hover");
51        mm_item_content_obj.css({
52          'top': ($mm_item_link.offset().top + $mm_item_link.outerHeight()) - 1 +"px",
53          'left': ($mm_item_link.offset().left) - 5 + 'px'
54        })
55        
56        if(options.justify == "left"){
57          var mm_object_right_end = $megamenu_object.offset().left + $megamenu_object.outerWidth();
58                                    // Coordinates of the right end of the megamenu object
59          var mm_content_right_end = $mm_item_link.offset().left + $mm_item_content.outerWidth() - 5 ;
60                                    // Coordinates of the right end of the megamenu content
61          if( mm_content_right_end >= mm_object_right_end ) { // Menu content exceeding the outer box
62            mm_item_content_obj.css({
63              'left': ($mm_item_link.offset().left - (mm_content_right_end - mm_object_right_end)) - 2 + 'px'
64            }); // Limit megamenu inside the outer box
65          }
66        } else if( options.justify == "right" ) {
67          var mm_object_left_end = $megamenu_object.offset().left;
68                                    // Coordinates of the left end of the megamenu object
69          var mm_content_left_end = $mm_item_link.offset().left - mm_item_content_obj.outerWidth() + 
70                                    $mm_item_link.outerWidth() + 5;
71                                    // Coordinates of the left end of the megamenu content
72          if( mm_content_left_end <= mm_object_left_end ) { // Menu content exceeding the outer box
73            mm_item_content_obj.css({
74              'left': mm_object_left_end + 2 + 'px'
75            }); // Limit megamenu inside the outer box
76          } else {
77            mm_item_content_obj.css({
78              'left': mm_content_left_end + 'px'
79            }); // Limit megamenu inside the outer box
80          }
81        }
82        if(options.enable_js_shadow == true) {
83          mm_item_content_obj.find(".mm-js-shadow").height( mm_item_content_obj.height() );
84          mm_item_content_obj.find(".mm-js-shadow").width( mm_item_content_obj.width() );
85          mm_item_content_obj.find(".mm-js-shadow").css({
86            'top': (options.shadow_size) + (isIE6 ? 2 : 0) + "px",
87            'left': (options.shadow_size) + (isIE6 ? 2 : 0) + "px",
88            'opacity': 0.5
89          });
90        }
91        switch(options.show_method) {
92          case "simple":
93                mm_item_content_obj.show();
94                break;
95          case "slideDown":
96                mm_item_content_obj.height("auto");
97                mm_item_content_obj.slideDown('fast');
98                break;
99          case "fadeIn":
100                mm_item_content_obj.fadeTo('fast', 1);
101                break;
102          default:
103                mm_item_content_obj.each( options.show_method );
104                break;
105        }
106      }, options.mm_timeout);
107    });
108    // Activation Method Ends
109    // Deactivation Method Starts
110    jQuery(this).bind(options.deactivate_action, function(e){
111      e.stopPropagation();
112      clearTimeout($mm_timer);
113      var mm_item_link_obj = jQuery(this).find("a.mm-item-link");
114      var mm_item_content_obj = jQuery(this).find("div.mm-item-content");
115//      mm_item_content_obj.stop();
116      switch(options.hide_method) {
117        case "simple":
118              mm_item_content_obj.hide();
119              mm_item_link_obj.removeClass("mm-item-link-hover");
120              break;
121        case "slideUp":
122              mm_item_content_obj.slideUp( 'fast',  function() {
123                mm_item_link_obj.removeClass("mm-item-link-hover");
124              });
125              break;
126        case "fadeOut":
127              mm_item_content_obj.fadeOut( 'fast', function() {
128                mm_item_link_obj.removeClass("mm-item-link-hover");
129              });
130              break;
131        default:
132              mm_item_content_obj.each( options.hide_method );
133              mm_item_link_obj.removeClass("mm-item-link-hover");
134              break;
135      }
136      if(mm_item_content_obj.length < 1) mm_item_link_obj.removeClass("mm-item-link-hover");
137    });
138//    Deactivation Method Ends
139  });
140  this.find(">li:last").after('<li class="clear-fix"></li>');
141  this.show();
142};