Question

我有一个我想要调整大小的元素，我必须同时调整它下面的元素。

jQuery resizable通过autoResize选项提供此功能。但是，它要求您提供选择器，例如类或ID。如果我提供一个类，它将使用该类调整页面上的所有元素。我宁愿提供一个相对选择器，如：

$(".panel").resizable({
  alsoResize: $(this).find(".panel-body")
});

但显然this不是我希望的.panel元素。可能解决这个问题的方法是提供resize函数，例如：

$(".panel").resizable({
  resize: function(event, ui){ $(ui.element).find(".panel-body").css('width', $(ui.element).width() - (ui.originalSize.width - ui.element.width))}
});

但这看起来有点荒谬。有什么建议吗？

Answer 1

我认为你可以这样做：

<div class="something"></div>

在javascript中，您可以找到它：

alsoResize: $(this).find(".something")

“Something”是你喜欢的任何东西，你不能在css中创建它。它对我很有用

Answer 2

选项1

创建您尝试定位的特定元素的变量。例如，如果您的目标是pictureLoading，请使用以下语法创建变量：

<div id="targetDiv">

然后将一个随机类添加到仅用于此特定目的的元素中（不需要使用CSS，但建议设置var $resizeTarget = $('div#targetDiv');是唯一的，只是为了确保仅定位该元素。）

background-color

从那里，您可以通过类或创建另一个变量来定位该元素，因为您知道它将位于全局名称空间中。

$resizeTarget.addClass('resizeTarget');

最后，将这个新创建的变量放在自动调整大小的函数中。

var $resizeTargetFinal = $('div.resizeTarget');

选项2

使用我从以下链接创建的此功能，该功能允许在调整大小时动态更改高度。 Dynamic Height Fiddle

为jQuery resizable nameResize选择子代

2 个答案: