Advertisement
IchHabRecht

[JS] Flexible jQuery tabs

Sep 16th, 2014
257
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. jQuery(document).ready(function($) {
  2.     jQuery('div.tx-jfmulticontent-pi1 > div.ui-tabs').each(function() {
  3.         var $navigation = jQuery('ul.ui-tabs-nav', this);
  4.         var $listItems = jQuery('li.ui-state-default', $navigation);
  5.         var width = $navigation.width();
  6.         var staticWidth = 0;
  7.         $listItems.each(function() {
  8.             var $this = jQuery(this);
  9.             if ($this.text().indexOf(' ') > -1) {
  10.                 $this.addClass('flexible');
  11.             } else {
  12.                 $this.addClass('static');
  13.                 staticWidth += $this.width();
  14.             }
  15.             width -= $this.outerWidth() - $this.width();
  16.         });
  17.         var $flexibleListItems = $listItems.filter('.flexible');
  18.         var $staticListItems = $listItems.filter('.static');
  19.         if ($flexibleListItems.length && $staticListItems.length) {
  20.             width = (width - staticWidth) / $flexibleListItems.length;
  21.             $flexibleListItems.width(width);
  22.         } else {
  23.             width = width / $listItems.length;
  24.             $listItems.width(width);
  25.         }
  26.         var height = Math.max.apply(null, $listItems.map(function() {
  27.             return jQuery(this).height();
  28.         }));
  29.         $listItems.height(height);
  30.     })
  31. });
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement