jquery resizable()不能工作(举个例子)

Question

请看到这项工作正在进行中：

http://rawgit.com/jfix/cover-image-position/master/index.html

我的目标是允许从桌面拖放到这个页面上，然后拖动图像并调整大小。您应该能够将图像拖到页面上并将其拖动。

然而，不工作的是调整图像大小。在图像周围的框架中没有显示句柄，并且不可能调整它的大小。控制台中没有错误。

有关守则如下：

hdl.resizable({
    aspectRatio: true,
    autoHide: true,
    alsoResize: "#coverimage",
    handles: 'all',
    resize: function(event, ui) {
    cvr
        .css('left', ui.position.left)
        .css('top', ui.position.top);
    }
});

其中hdl是assets/script.js文件中$('#handler')的简短形式。我应该注意到，这几乎是逐字复制的，显然是从运行良好的jsfiddle：http://jsfiddle.net/nL5ew/中复制出来的。

我似乎找不到我的代码的问题。谢谢你的敏锐洞察力。

Answer 1

检查了@RRR的JSFiddle，并将其逐行与我的代码进行比较后，我发现我并没有包括JQuery UI套件中的一个重要的CSS文件。这是丢失的那条线：

<link rel="stylesheet" type="text/css" href="//code.jquery.com/ui/1.9.2/themes/base/jquery-ui.css">

公平地说，正确的解决方案是由@RRR提供的，不幸的是，答案并不是完整的，而仅仅是在评论中。

Answer 2

使用此语法可以获得更好的结果：

 $(selector, context).resizable({option1: value1, option2: value2..... });