Search code examples
javascripthtmlresizedraggable

How to create a re sizable only vertically div? (alike SO form)


What we need is simple - 3 divs whose width is static - not changable

  • one on top (of page) - resizable ONLY vertically
  • one draggable - "separator" in the middle (of page) (not resizable)
  • one div just above that "separator". It shall move but not resize while the "separator" is beeng dragged.

we need them to be divs - not text fields because I plan to host in resizable a flash object. jQuery can be used. How to create such thing?


Solution

  • Here's an example, only tested in Chrome. Hopefully it will get you on your way.

    http://jsfiddle.net/tZQx7/2/

    Edit: fixed jsfiddle link, was point to an older version