I need 3 divs which would span across the screen (100%, but that's not the main point) and be able to adjust their widths using mouse. The functionality I am trying to achieve is to be able to shrink the width of one div resulting in making another di开发者_开发问答v wider.
I am thinking of using jQuery UI Resizable, but I couldn't find any examples of using that with multiple divs.
Any ides or links to examples?
You should inspect the jQuery Layout plugin, doing exactly what you need and much more.
You could do what you need like this (not tested but should work) :
<html>
<head>
<script src="jquery.js"></script>
<script src="jquery.layout.js"></script>
<script>
$(document).ready(function () {
$('body').layout({ applyDefaultStyles: true });
});
</script>
</head>
<body>
<div class="ui-layout-center">Center</div>
<div class="ui-layout-east">East</div>
<div class="ui-layout-west">West</div>
</body>
</html>
精彩评论