jquery - How do I make a div width draggable? -


i have div nested inside div used display settings console. nested div has fixed positioned inside parent follows:

div arrangement

i'd add draggable handle child div's left border child div can resized on width. need add narrow div left hand border positioned can dragged , position recalculated dynamically resize child divs width property?

i'd rather stick vanilla jquery if possible rather relying on jquery ui.

i think you're looking

handles: handles can used resizing.

example: $( ".selector" ).resizable({ handles: "n, e, s, w" });

html:

<div class="parent">     <div class="child"></div> </div> 

css:

.parent {     position: relative;     width: 800px;     height: 500px;     background: #000; } .child {     position: absolute;    right: 0;     top: 0;     width: 200px;     height: 100%;             background: #ccc; } 

js:

$('.child').resizable({     handles: 'n,w,s,e',     minwidth: 200,     maxwidth: 400 }); 

check jsfiddle

edit: solved css issue, updated fiddle


Comments

Popular posts from this blog

curl - PHP fsockopen help required -

HTTP/1.0 407 Proxy Authentication Required PHP -

c# - Resource not found error -