Splitter.js won't work with new versions of jQuery

Question

I\'m using Splitter.js in a project.

The code is from http://methvin.com/splitter/ The specific JS is at http://methvin.com/splitter/splitter.js

Answer 1

I ran into the same problem in the process of upgrading a site to jQuery 1.8. After a bit of debugging and poking around in the code, it seems to me there were two issues: the resize event was getting triggered unnecessarily in a few places, and it was getting triggered on the splitter before the splitter's resize event handler had been setup. I switched the order of the last two chunks of code to make sure the splitter's resize event handler gets set up first and tidied up a few lines. It now looks like this:

  // Resize event handler
  splitter.bind("resize", function(e, size){
    // Determine new width/height of splitter container
    splitter._DF = splitter[0][opts.pxFixed] - splitter._PBF;
    splitter._DA = splitter[0][opts.pxSplit] - splitter._PBA;
    // Bail if splitter isn't visible or content isn't there yet
    if ( splitter._DF <= 0 || splitter._DA <= 0 ) return;
    // Re-divvy the adjustable dimension; maintain size of the preferred pane
    resplit(!isNaN(size)? size : (!(opts.sizeRight||opts.sizeBottom)? A[0][opts.pxSplit] :
        splitter._DA-B[0][opts.pxSplit]-bar._DA));
    e.stopPropagation();
  });

  // Resize event propagation and splitter sizing
  if ( opts.anchorToWindow ) {
    // Account for margin or border on the splitter container and enforce min height
    splitter._hadjust = dimSum(splitter, "borderTopWidth", "borderBottomWidth", "marginBottom");
    splitter._hmin = Math.max(dimSum(splitter, "minHeight"), 20);
    splitter._bottomOffset = opts.bottomOffset ? opts.bottomOffset : 0;
    $(window).bind("resize", function(){
      var top = splitter.offset().top;
      var wh = $(window).height() - splitter._bottomOffset;
      splitter.css("height", Math.max(wh-top-splitter._hadjust, splitter._hmin)+"px");
      splitter.trigger("resize");
    }).trigger("resize");
  }
  else if ( opts.resizeToWidth )
    $(window).bind("resize", function(){
      splitter.trigger("resize");
    });

Also, make sure you remove

if ( !$.browser.msie ) panes.trigger("resize");

from the reSplit function. I've uploaded the whole thing to a GitHub repo if you want to see it all in one place.