我无法使用iscroll插件调整div宽度。我猜这些插件是重叠的。另外,我的代码有点混杂。因为我使用小部件结构,我可以共享一些示例代码。但是你可以检查iscroll插件。你能告诉我最好的方法吗?提前谢谢。
http://lab.cubiq.org/iscroll5/demos/horizontal/
$.widget("flexpanel", {
options: {
onReady: null,
currentId: null,
beforeId: null,
nextId: null,
type: null,
data: null,
previousData: null,
respawn: null,
title: null,
minimizeBar: null,
minimizeHeaderText: null,
headerBar: null,
content: null,
showMinimizeBar: null,
width: null
},
_create: function () {
var me = this;
me.options.onReady();
me.element.addClass("flexPanelContent ui-widget-content");
var MainContent = me.element[0];
var InnerContent = $("<div>").appendTo(MainContent);
InnerContent.css({
"width": me.options.width - 1 + "px",
"height": "100%",
"display": "block",
"float": "left"
});
var WidthHandle = $("<div>").appendTo(MainContent).addClass("ui-resizable-handle ui-resizable-s");
me.options.minimizeBar = $("<div>").appendTo(InnerContent);
me.options.minimizeBar.addClass("minimizeBar");
me.options.minimizeHeaderText = $("<div>").appendTo(me.options.minimizeBar);
me.options.minimizeHeaderText.addClass("vertical-text minimizeHeader").html(me.options.title);
if (me.options.showMinimizeBar != null) {
var type = me.options.showMinimizeBar ? "block" : "none";
me.options.minimizeBar.css("display", type);
if (type == "block") {
me.element.css("width", "40px");
me.Loaded(40);
}
else {
me.element.css("width", me.options.width + "px");
me.Loaded(me.options.width);
}
}
$(me.element).resizable({
handles: "e"
});
},
Loaded: function (value) {
var _width = $("#scroller").width();
_width += value;
$("#scroller").css("width", _width + "px");
myScroll = new IScroll('#wrapper', { scrollX: true, scrollY: false, mouseWheel: true });
}
});
&#13;