更改布局div的宽度后设置layout.sizePane（“west”）

Question

正在为容器div创建布局，其中有两个div，一个是西窗格，另一个是中心窗格，现在正在更改容器div的宽度，然后尝试设置“西窗格”大小以填充整个容器div，它没有按预期工作，这是我试过的，

<div  id="ResizeDiv" class="ui-layout-pane" style="width:700px;height:500px; background-color:red;">
<div class="ui-layout-west " style="background-color:yellow;">West</div>
<div class="ui-layout-center" style="background-color:pink;" >center</div>
</div>

$(document).ready(function () {
                var myLayout = $('#ResizeDiv').layout({ applyDefaultStyles: true, resize: true });
                $("#changeWidth").click(function () {
                    $("#ResizeDiv").css("width","900px");
                });
                $("#westPaneWidth").click(function () {
                    myLayout.sizePane("west", 800);
                });
            });

这是工作fiddle sample。 首先单击“更改容器宽度”按钮，您可以看到容器宽度更改为红色背景，然后单击“更改西窗格宽度”按钮，现在西窗格应该更改它的宽度并填充容器，但它不能像那样工作， 请在这件事上给予我帮助。