1

尝试使用 jQuery UI 调整图像大小和拖动。有这个问题,

下面是由 jQuery IU 自动添加的。但是,如果我加载不同的图像,这不会改变它的原始大小。意味着即使我动态加载不同的图像,它也会保持原始图像的宽度和高度。

<div style="overflow: hidden; position: absolute; width: 493px; height: 370px; top: 0px; left: 0px; margin: 0px;" class="ui-wrapper">

这是我的 HTML

<div id="photo-area">
<div id="photo-canvas">
    <div class="design-mask">&nbsp;</div>
    <div class="photo-wrap">
        <div class="photo-resize">
              <img id="photo-mask" class="pp-photo" />  
        </div>
    </div>
</div>

这是我的 Javascript

$j(".photo-wrap").draggable({
    containment: "#photo-canvas",
    opacity: 0.35,
});

$j(".pp-photo").resizable({
    aspectRatio: true,
    ghost: true,

});

我通过一个 PHP 脚本上传我的文件,该脚本将图像保存在服务器上,并将带有图像数据的 JSON 传递给加载图像的 JS 函数,

$j.each(data.result.files, function (index, file) {
    $j('#photo-mask').load( function(){  

          //JQUERY DRAGGABLE CODE
          .....
          .....
         //JQUERY RESIZABLE CODE
         .....
         .....

     }).attr("src",file.url);
}); 

任何想法如何解决这一问题?

4

1 回答 1

2

找到了解决该问题的方法,每次加载新照片时,我都会执行以下操作。这将初始化调整大小对象:

$j('.dl-photo').resizable("destroy");
于 2013-07-25T01:05:54.870 回答