Custom Resizable Handles in JQuery UI

Question

I\'ve been attempting to create a resizable textbox (ASP.NET multiline TextBox / HTML textarea) and use JQuery UI to make it resizable, but seem to

Answer 1

Finally found an extremely effective solution after hours of trying to get over this annoying bug. Simply, append your handle element in the ui class. The function below has been tested and works fine with South and West handles. Hope that helps!

function resizables(element, handle, type){

 var height = handle.height();
 var place = type =="s"? "bottom":"top";
 var css = {};
        css["height"] = height+"px";
        css[place] = -height+"px";


 element.resizable({handles: type});
 var jqclass = element.find(".ui-resizable-"+type);

        handle.css({"cursor": type+"-resize"});
        jqclass.append(handle); 
        jqclass.css(css);
}

When you call the function like below, your custom handle will be placed in the right location and will work probably. PS: the function works with 'n' and 's' handles.

resizables($("#draggable"), $("#handle"), 's');