JAVASCRIPT   21

Supersubs js

Guest on 17th July 2022 05:35:00 AM

  1.  
  2. /*
  3.  * Supersubs v0.2b - jQuery plugin
  4.  * Copyright (c) Joel Birch
  5.  *
  6.  * Dual licensed under the MIT and GPL licenses:
  7.  *      http://www.opensource.org/licenses/mit-license.php
  8.  *      http://www.gnu.org/licenses/gpl.html
  9.  *
  10.  *
  11.  * This plugin automatically adjusts submenu widths of suckerfish-style menus to that of
  12.  * their longest list item children. If you use this, please expect bugs and report them
  13.  * to the jQuery Google Group with the word 'Superfish' in the subject line.
  14.  *
  15.  */
  16.  
  17. ;(function($){ // $ will refer to jQuery within this closure
  18.  
  19.         $.fn.supersubs = function(options){
  20.                 var opts = $.extend({}, $.fn.supersubs.defaults, options);
  21.                 // return original object to support chaining
  22.                 return this.each(function() {
  23.                         // cache selections
  24.                         var $$ = $(this);
  25.                         // support metadata
  26.                         var o = $.meta ? $.extend({}, opts, $$.data()) : opts;
  27.                         // get the font size of menu.
  28.                         // .css('fontSize') returns various results cross-browser, so measure an em dash instead
  29.                        
  30.                         //------------------------ commenté par Maxime
  31.  
  32.                 /*var fontsize = $('<li id="menu-fontsize">&#8212;</li>').css({
  33.                                 'padding' : 0,
  34.                                 'position' : 'absolute',
  35.                                 'top' : '-999em',
  36.                                 'width' : 'auto'
  37.                         }).appendTo($$).width(); //clientWidth is faster, but was incorrect here
  38.                         // remove em dash
  39.                         $('#menu-fontsize').remove();*//
  40.                 //-----------------------------------------------
  41.  
  42.                        
  43.                 // cache all ul elements
  44.  
  45.                         $ULs = $$.find('ul');
  46.                 // loop through each ul in menu
  47.  
  48.                         $ULs.each(function(i) {
  49.                         // cache this ul
  50.  
  51.                                 var $ul = $ULs.eq(i);
  52.                         // get all (li) children of this ul
  53.  
  54.                                 var $LIs = $ul.children();
  55.                         // get all anchor grand-children
  56.  
  57.                                 var $As = $LIs.children('a');
  58.                         // force content to one line and save current float property
  59.  
  60.                                 var liFloat = $LIs.css('white-space','nowrap').css('float');
  61.                         // remove width restrictions and floats so elements remain vertically stacked
  62.  
  63.                                 var emWidth = $ul.add($LIs).add($As).css({
  64.                                         'float' : 'none',
  65.                                         'width' : 'auto'
  66.                                 })
  67.                         // this ul will now be shrink-wrapped to longest li due to position:absolute
  68.  
  69.                         // so save its width as ems. Clientwidth is 2 times faster than .width() - thanks Dan Switzer
  70.  
  71.                                 .end().end()[0].clientWidth;
  72.                         // add more width to ensure lines don't turn over at certain sizes in various browsers
  73.  
  74.                         //------------------------ commenté par Maxime
  75. e
  76.                                 emWidth += o.extraWidth;
  77.                 //-----------------------------------------------
  78. -
  79.                 // restrict to at least minWidth and at most maxWidth
  80. h
  81.                                 if (emWidth > o.maxWidth)               { emWidth = o.maxWidth; }
  82.                                 else if (emWidth < o.minWidth)  { emWidth = o.minWidth; }
  83.                                 emWidth += 'px';
  84.                 // set ul to width in ems
  85. s
  86.                                 $ul.css('width',emWidth);
  87.                 // restore li floats to avoid IE bugs
  88. s
  89.                 // set li width to full width of this ul
  90. l
  91.                 // revert white-space to normal
  92. l
  93.                                 $LIs.css({
  94.                                         'float' : liFloat,
  95.                                         'width' : '100%',
  96.                                         'white-space' : 'normal'
  97.                                 })
  98.                 // update offset position of descendant ul to reflect new width of parent
  99. t
  100.                                 .each(function(){
  101.                                         var $childUl = $('>ul',this);
  102.                                         var offsetDirection = $childUl.css('left')!==undefined ? 'left' : 'right';
  103.                                         $childUl.css(offsetDirection,emWidth);
  104.                                 });
  105.                         });
  106.                        
  107.                 });
  108.         };// expose defaults
  109. s
  110.         $.fn.supersubs.defaults = {
  111.                 minWidth                : 9,// requires em unit.
  112. .
  113.                 maxWidth                : 55,// requires em unit.
  114. .
  115.                 extraWidth              : 0     // extra width can ensure lines don't sometimes turn over due to slight browser differences in how they round-off values
  116. s
  117.         };
  118.        
  119. })(jQuery)// plugin code ends

Raw Paste


Login or Register to edit or fork this paste. It's free.