你有两个可调整大小的元素：一个应该垂直调整大小。另一个
水平使用可调整大小的小部件 - alsoResize （默认：您使用它来调整一个或多个大小
元素同步与可调整大小的元素）。
因此，当您调整水平元素的大小时，它应该仅在宽度上调整大小。垂直
元素只能在高度上调整大小。
我已尝试过这里建议的所有内容（以及更多内容）：
这是我的尝试（感谢您修复，用户）：
<html>
<lang="en">
<header>
<meta charset="UTF-8">
<link rel="stylesheet"
href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/themes/smoothness/jquery-ui.css"/>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script type="text/javascript" src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
</header>
<body>
<div class="cross">
<div id="horizontal">
<h3>HORIZONTAL</h3>
<div id="vertical">
<h3>VERTICAL</h3>
</div>
</div>
</div>
<style>
body {
background-color: gray;
width: 100%;
}
#horizontal {
width: 280px;
height: 2px;
background-color:white;
position: relative;
left: 540px;
top: 400px;
}
#vertical {
width: 2px;
height: 550px;
background-color:white;
position: absolute;
left: 140px;
top: -260px;
}
#horizontal h3, #vertical h3 {
text-align: center;
margin: 0;
}
.cross {
position: absolute;
height: 20px;
width: 200px;
}
</style>
<script>
$(document).ready(function () {
$( "#vertical" ).resizable({
alsoResize: "#horizontal",
handles: "n , s"
});
$( "#horizontal" ).resizable({
handles: "w , e"
});
});
</script>
</body>
</html>