增加和减少jquery移动面板的宽度

Question

我正在使用jquery移动面板。我在面板中添加内容。

$("#load").on("click", function () {
    var items = $("#p2 .ui-content").contents().clone();
    $(this).after(items);
});

示例：

http://jsfiddle.net/Palestinian/Lcbd2/

我希望减小面板的宽度，但在面板中添加第二次内容时再次获得实际尺寸。

Answer 1

面板的原始尺寸为width: 17em;。

使用css使面板更小。

.ui-panel {
width: 12em !important;
}

如果您想要向左或向右定位特定面板

.ui-panel-position-right {
width: 12em !important;
}

.ui-panel-position-left{
width: 12em !important;
}

<强>演示

http://jsfiddle.net/ybvfxu39/

<强> Jquery的即可。如您所知，面板的原始尺寸为 17em ，您可以在需要时使用以下代码设置尺寸。

$(".ui-panel-position-right").css("width", "12em");

<强>演示

http://jsfiddle.net/z4k8L3vu/