调整元素大小可以带来更好的用户体验，因为它适合他们的屏幕。

oyoresizer是一个简单、轻量级的jQuery可调整大小的插件，它允许您通过拖动元素的右边框来调整元素的大小

如果你想在你的网站上调整一个元素的大小，这就是适合你的插件。你会注意到“元素”这个词很模糊。这是因为这个插件不限制你只调整DIV、图像、段落或Iframes的大小——任何有设定宽度和高度的东西都会利用我们插件的魔力来调整大小。

如何使用它:

1.加载主脚本oyoresizer.js公司在jQuery库之后。

<script src="/path/to/cdn/jquery.slim.min.js"></script>
<script src="/path/to/oyoresizer.js"></script>

2.在应该可以调整大小的元素上初始化插件。

<div id="example" class="resizable">
   I'm resizable
</div>

$(function(){
  var instance = new oyoresizer(".resizable");
});

3.设置可调整大小的元素的最小/最大宽度。

// oyoresizer(selectors, minX, maxX);
var resizables = new oyoresizer(".resizable", 160, 400);

4.该插件还支持JavaScript动态生成的元素。

<iframe id="frame-demo"></iframe>

$("#frame-demo").attr("src", "https://www.youtube.com/embed/r_W49tWhVys");
var instance2 = new oyoresizer("#frame-demo");
instance2.setSize(200, 600);

5.以像素为单位设置调整大小的边距。

instance.resizeMargin = 25;

预览截图

调整元素大小 jQuery插件 oyoresizer