See: http://bugs.jquery.com/ticket/12491

Can jQuery UI be updated to at least 1.9.2? (which does not have the issue)

This issue makes Drupal.toolbar.height() work incorrectly

Comments

jamescdavis-1’s picture

This issue seems to be fixed as of jQuery UI 1.8.23. Updating to this or a later version will fix the issue. I recommend, at a bare minimum, to update to the latest 1.8 minor version (1.8.24).

ericduran’s picture

Status: Active » Closed (duplicate)
mineshaftgap’s picture

If others are trying to fix this without having to move to the dev branch, I was able to by redefining innerWidth, innerHeight, outerWidth & outerHeight from the jQuery UI function in my own javascript:

// overwrite innerWidth, innerHeight, outerWidth & outerHeight so that it does not have a problem with jQuery UI 1.8.11 and modals can pop in the right place
  jQuery.each( [ "Width", "Height" ], function( i, name ) {
    var side = name === "Width" ? [ "Left", "Right" ] : [ "Top", "Bottom" ],
      type = name.toLowerCase(),
      orig = {
        innerWidth: jQuery.fn.innerWidth,
        innerHeight: jQuery.fn.innerHeight,
        outerWidth: jQuery.fn.outerWidth,
        outerHeight: jQuery.fn.outerHeight
      };

    function reduce( elem, size, border, margin ) {
      jQuery.each( side, function() {
        size -= parseFloat( jQuery.css( elem, "padding" + this, true) ) || 0;
        if ( border ) {
          size -= parseFloat( jQuery.css( elem, "border" + this + "Width", true) ) || 0;
        }
        if ( margin ) {
          size -= parseFloat( jQuery.css( elem, "margin" + this, true) ) || 0;
        }
      });
      return size;
    }

    jQuery.fn[ "inner" + name ] = function( size ) {
      if ( size === undefined ) {
        return orig[ "inner" + name ].call( this );
      }

      return this.each(function() {
        jQuery( this ).css( type, reduce( this, size ) + "px" );
      });
    };

    jQuery.fn[ "outer" + name] = function( size, margin ) {
      // default to false
      if (size === undefined) {
        size = false;
      }

      if ( typeof size !== "number" ) {
        return orig[ "outer" + name ].call( this, size );
      }

      return this.each(function() {
        jQuery( this).css( type, reduce( this, size, true, margin ) + "px" );
      });
    };
  });