jQuery Vertical Splitter (Skinny Splitbar)

See the splitter documentation

This is the left side of the vertical splitter.

Note what happens when you move the splitbar as far left as you can to make this pane very thin. A scrollbar appears and it is flush against the splitbar, just the way it should be.

The splitbar needs to be wide enough to grab with the mouse, but a thick splitbar may be visually distracting in a design. This example shows how to make a splitbar that looks skinny but has a wider grabbing area. It also demonstrates the use of an alternate resize cursor. (Not all browsers support alternate cursors and only IE seems to support animated cursors.)

A background image in the splitbar provides the visual marker but the splitbar area extends further right, appearing as padding on the right pane. The splitbar's hot zone is "biased" to the right so that it will not have a gap against any left-side scrollbar when it appears. If you know the left pane will never have a scroll bar, you could make the hot zone centered on the skinny splitbar.