<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="language" content="en" />
<link rel="stylesheet" type="text/css" href="./custom-theme/jquery-ui-1.8.17.custom.css" />
<!-- CUSTOMIZE/OVERRIDE THE DEFAULT CSS -->
<style type="text/css">
/* remove padding and scrolling from elements that contain an Accordion OR a content-div */
.ui-layout-center , /* has content-div */
.ui-layout-west , /* has Accordion */
.ui-layout-east , /* has content-div ... */
.ui-layout-east .ui-layout-content { /* content-div has Accordion */
padding: 0;
overflow: hidden;
}
.ui-layout-center P.ui-layout-content {
line-height: 1.4em;
margin: 0; /* remove top/bottom margins from <P> used as content-div */
}
h3, h4 { /* Headers & Footer in Center & East panes */
font-size: 1.1em;
background: black;
border: 1px solid #BBB;
border-width: 0 0 1px;
padding: 7px 10px;
margin: 0;
}
.ui-layout-east h4 { /* Footer in East-pane */
font-size: 0.9em;
font-weight: normal;
border-width: 1px 0 0;
}
</style>
<!-- REQUIRED scripts for layout widget -->
<script type="text/javascript" src="jquery-latest.js"></script>
<script type="text/javascript" src="jquery-ui-latest.js"></script>
<script type="text/javascript" src="jquery.layout-latest.js"></script>
<script type="text/javascript" src="jquery.layout.resizePaneAccordions-1.0.js"></script>
<script type="text/javascript" src="debug.js"></script>
<script type="text/javascript">
$(document).ready( function() {
myLayout = $('body').layout({
west__size: 300
, central_size: 400
});
$('#date').datepicker();
// ACCORDION - in the West pane
$("#accordion1").accordion({ size: 200,
fillSpace: true });
//$("#accordion2").resizable(maxHeight= 100);
//$("#accordion2").accordion({ autoHeight : false
//,fillSpace: true
//,event: "click"});
$('#tab').tabs();
});
</script>
<script type="text/javascript">
$(function() {
$(".ui-layout-west").resizable({disabled: true});
});
</script>
</head>
<body>
<div class="ui-layout-north ui-widget-content" style="display: none;">
North Pane
</div>
<div class="ui-layout-south ui-widget-content ui-state-error" style="display: none;"> copiright Fairy tail </div>
<div class="ui-layout-center ui-widget-content " style="display: none;">
<div id="tab">
<ul>
<li class="prova"><a href="#fragment-1"><span>Uno</span></a></li>
<li><a href="#fragment-2"><span>Due</span></a></li>
</ul>
<div id="fragment-1">
<p>Testo 1</p>
</div>
<div id="fragment-2">
<input type="text" name="date" id="date" /> Lorem ipsum dolor sit amet, consectetuer adipiscing elit...
</div>
</div>
</div>
<div class="ui-layout-west " style="display: none;">
<div id="accordion1" class="basic">
<h3><a href="#">Section 1</a></h3>
<div>
<h5>West Pane</h5>
<p>Mauris mauris ante, blandit et, ultrices a, suscipit eget, quam.
Integer ut neque. Vivamus nisi metus, molestie vel, gravida in, condimentum sit amet, nunc.</p>
<p>Nam a nibh. Donec suscipit eros. Nam mi. Proin viverra leo ut odio. Curabitur malesuada.
Vestibulum a velit eu ante scelerisque vulputate.</p>
</div>
<h3><a href="#">Section 2</a></h3>
<div>
<h5>Sed Non Urna</h5>
<p>Donec et ante. Phasellus eu ligula. Vestibulum sit amet purus.
Vivamus hendrerit, dolor at aliquet laoreet, mauris turpis porttitor velit,
faucibus interdum tellus libero ac justo.</p>
<p>Vivamus non quam. In suscipit faucibus urna.</p>
</div>
<h3><a href="#">Section 3</a></h3>
<div>
<p>Nam enim risus, molestie et, porta ac, aliquam ac, risus. Quisque lobortis.
Phasellus pellentesque purus in massa. Aenean in pede.</p>
<p>Phasellus ac libero ac tellus pellentesque semper. Sed ac felis. Sed commodo,
magna quis lacinia ornare, quam ante aliquam nisi, eu iaculis leo purus venenatis dui.</p>
<ul>
<li>List item one</li>
<li>List item two</li>
<li>List item three</li>
</ul>
</div>
<h3><a href="#">Section 4</a></h3>
<div>
<p>Cras dictum. Pellentesque habitant morbi tristique senectus et netus et malesuada fames
ac turpis egestas.</p>
<p>Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae;
Aenean lacinia mauris vel est.</p>
<p>Suspendisse eu nisl. Nullam ut libero. Integer dignissim consequat lectus.
Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos.</p>
</div>
</div>
</div>
</body>
</html>
大家好，我的问题如下：我希望用户无法调整西面板的大小：我检查了库但是我无法弄明白。我正在使用jQuery布局，有人可以帮助我吗？谢谢！
答案 0 :(得分：7)
您正在使用布局插件，它与可调整大小的内容不同。
由于我的移动设备，我无法正确复制粘贴，但请尝试将布局选项更改为：
{
west__size: 300,
west__resizable: false,
central__size
}