Question

我想知道是否可以从我点击的区域调整内容的大小，而不是左上角的默认调整大小。

var $cont = $('.container .content'),
    init_size = $cont.width()*0.1,
    ratio = $cont.width() / $cont.height(),
    c =0,
    s = [400,init_size];

$cont.height( init_size );

$cont.click(function(){   
    $(this).stop().animate({height: s[c%2], width: s[c%2] * ratio });
    c++;
});

你可以看到它从左上角到右下角调整大小，是否可以设置它开始调整大小的点，具体取决于我clic的位置？

Answer 1

是的，在调整大小时，请以适当的比例移动图像，以使较大图像中的点与点击事件的位置具有相同的相对点。基本上这意味着根据比率将其移动到负顶部和左侧。点击时图像放置的计算是：

New position = Mouse click event position-New size/Old Size*Mouse click event position

这是一个jsfiddle示例

此示例使用相等宽度/高度比，但您可以轻松地在其上构建以支持您需要的任何比率

从我单击的区域调整大小

1 个答案: