0

jqueryui で要素をサイズ変更可能にし、jqueryui resizable を使用せずに、たとえば jquery.css('width') によってこの要素のサイズを変更すると、jqueryui のサイズ変更可能なハンドルは要素と共に移動しません。

HTML:

<img id="image" src="http://www.google.com.br/images/srpr/logo3w.png"/>
<input id="resizeImage" type="button" value="Resize Image" />

脚本:

var image = $('#image');
image.resizable();
$('#resizeImage').on('mouseup', function () {
  image.css('width', parseInt(image.width() - 1, 10) + 'px');
});

これを回避する方法はありますか?

4

2 に答える 2

1

サイズ変更可能なものを破棄して再初期化することで機能しますが、それは私にはやり過ぎのようです...

var image = $('#image');
image.resizable();
$('#resizeImage').on('mouseup', function () {
image.resizable('destroy')
  .css('width', parseInt(image.width() - 1, 10) + 'px')
  .resizable();
});

http://jsfiddle.net/Mghhf/3/

于 2013-01-21T17:42:32.827 に答える
0

を使用する.resizable()と、その要素が でラップされ<div class="ui-wrapper"></div>ます。次のことをお勧めします。

var image = $('#image');
image.resizable();
$('#resizeImage').on('mouseup', function () {
     image.css('width', parseInt(image.width() - 1, 10) + 'px');
     $('.ui-wrapper').css('width', parseInt(image.width() - 1, 10) + 'px');
});

デモ: http://jsfiddle.net/Mghhf/5/

お役に立てれば!

于 2013-01-21T17:49:03.150 に答える