Search code examples
javascriptjqueryjquery-uihtml-tablejquery-ui-resizable

Unsuccessful in applying the jQuery.resizable API to an HTML table


I am wanting to apply the jQuery resizable API to my HTML table, but it does not seem to be working as it should, there is no handle appearing at the top of my table headers to resize the columns.

Here is the fiddle:

http://jsfiddle.net/6434t/3/

$(function() {
$("#data tr th").resizable({ handles: 'e' });
});

Solution

  • I played around with the CSS line-by-line to see what could have changed that would make jQuery not compatible with the CSS.

    Changed the css line from:

    #data thead tr {
            top: expression(this.offsetParent.scrollTop);
            position: relative;
    }
    

    to:

    #data th tr {
            top: expression(this.offsetParent.scrollTop);
            position: relative;
    }