工作在可满足的图像。希望能够有一个拖拽手柄在右下角的图像，以允许用户动态调整大小。我在许多html编辑器中看到了这一点，所以一定有一些标准的方法可以工作……请给我指出正确的方向(Jquery优先，但也可以是其他的)。
发现:老帖子的人使用Jquery UI成功。我在这个jsfiddle上尝试了同样的方法，并在小提琴中取得了同样的结果-它有效，并且有一个右下角的拖动手柄!我注意到它使用了相当旧版本的Jquery和Jquery UI。我怀疑在使用最新版本的Jquery时可能会出现问题，因为选择更新的版本会使Jquery UI选项消失?
我在我的网页上尝试了完全相同的代码，使用Jquery 1.91, Jquery UI 1.92，匹配小提琴，但没有在我的页面上工作。它缺少右下角的拉标签来调整大小。有什么区别呢?
我也尝试使用最新的Jquery:
<script
src="https://code.jquery.com/jquery-3.5.1.js"
integrity="sha256-QWo7LDvxbWT2tbbQ97B53yJnYU3WhH/C8ycbRAkjPDc="
crossorigin="anonymous">
</script>
但这没有任何区别。下面是与小提琴匹配的代码(在我的页面上不起作用，没有拖动句柄)。
<!DOCTYPE html>
<html>
<head>
<script
src="https://code.jquery.com/jquery-1.9.1.js"
integrity="sha256-e9gNBsAcA0DBuRWbm0oZfbiCyhjLrI6bmqAl5o+ZjUA="
crossorigin="anonymous">
</script>
<script
src="https://code.jquery.com/ui/1.9.2/jquery-ui.js"
integrity="sha256-PsB+5ZEsBlDx9Fi/GXc1bZmC7wEQzZK4bM/VwNm1L6c="
crossorigin="anonymous">
</script>
<script>
$('#image').resizable();
</script>
</head>
<body>
<img id="image" style="border: 5px solid black;" src="http://www.google.com.br/images/srpr/logo3w.png" />
</body>
</html>
在Chrome, Firefox, Edge, IE中结果相同。
编辑:根据Tushar的解决方案，包括CSS，我已经试过了，它仍然没有产生拉标签…见下文:
<html>
<head>
<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.9.2/themes/base/jquery-ui.min.css" rel="stylesheet"/>
<script src="https://code.jquery.com/jquery-1.9.1.js"></script>
<script src="https://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
</head>
<body>
<img id="image" style="border: 5px solid black;" src="http://www.google.com.br/images/srpr/logo3w.png" />
</body>
</html>
哦!忘记添加脚本了，之后就可以正常工作了:
<script>$('#image').resizable();</script>
你缺少jquery-ui CSS，尝试添加，它会工作。
http://code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css
PS:确保你有正确的版本CSS匹配你的jQuery-ui的js文件。
- 更新CDN链接
$('#image').resizable();<link href="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.9.2/themes/base/jquery-ui.min.css" rel="stylesheet"/>
<script src="https://code.jquery.com/jquery-1.9.1.js"></script>
<script src="https://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
<img id="image" style="border: 5px solid black;" src="http://www.google.com.br/images/srpr/logo3w.png" />