JQuery UI - .resizable 不起作用
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/16692919/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
JQuery UI - .resizable not working
提问by user2307545
I have looked around and although I have found similar questions to this one, none of them had any solutions that worked for me.
我环顾四周，虽然我发现了与此类似的问题，但没有一个对我有用的解决方案。
Here is a link to another question similar. Draggable and resizable in JqueryUI for an image is not working?
这是另一个类似问题的链接。 图像的 JqueryUI 中的可拖动和可调整大小不起作用？
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://code.jquery.com/ui/1.9.2/jquery-ui.js"></script>
</head>
<body>
<div id="draggableHelper" style="display:inline-block">
<img id="image" src="http://www.google.com.br/images/srpr/logo3w.png" />
</div>
<script type="text/javascript">
$(document).ready(function(){
$('#draggableHelper').draggable();
$('#image').resizable();
});
</script>
</body>
</html>
This is just a very basic example but when I run this the image is movable but is not resizable. Although as far as I can tell, it should definitely work.
这只是一个非常基本的例子，但是当我运行它时，图像是可移动的，但不能调整大小。尽管据我所知，它绝对应该有效。
In the link above at the bottom of the question there is a link to a working example. http://jsfiddle.net/8VY52/The example is using jfiddle with this exact same HTML and javascript.
在问题底部的上方链接中，有一个指向工作示例的链接。 http://jsfiddle.net/8VY52/该示例使用 jfiddle 和完全相同的 HTML 和 javascript。
Is there something I am missing about Jquery UI, why does this work through Jfiddle but does not seem to work within the code above.
关于 Jquery UI，我是否遗漏了一些东西，为什么这可以通过 Jfiddle 工作，但似乎在上面的代码中不起作用。
Thanks.
谢谢。
回答by Arun P Johny
回答by Modestas Stankevi?ius
Complete working code would be.
完整的工作代码将是。
</head>
<body>
<div id="draggableHelper" style="display:inline-block">
<div id="image"><img src="http://www.google.com.br/images/srpr/logo3w.png" /></div>
</div>
<script type="text/javascript">
$(document).ready(function(){
$('#image').resizable();
$('#image').draggable();
$('#image').resize(function(){
$(this).find("img").css("width","100%");
$(this).find("img").css("height","100%");
});
});
</script>
</body>
</html>
回答by amit
This will work for you.
这对你有用。
<div id="draggableHelper" style="display:inline-block">
<div id="image"><img src="http://www.google.com.br/images/srpr/logo3w.png" /></div>
</div>
