I would like to implement resizable table columns, such that when you click and drag on a "notch" on the right side of the th (just a styled div inside the th), a new "marquee" element is created inside the th and displayed as a guide for resizing. On mouseup, the marquee disappears and the th element's width is set to the new width.
I have created a fiddle to illustrate.
It seems like the answer is to create a directive, but my main hangup is how to handle the dynamically-added window mousemove listener plus the "one" window mouseup listener within the directive logic.
$th.width()won't work unless the table is already visible in the DOM. If the directive is using a template to create the table. You might have to use$timeout. Otherwise, I don't see anything in your fiddle that can be done in a directive. – Mathew Foscarini Apr 15 at 19:17