Side navigation
#2464 closed enhancement (invalid)
Opened March 06, 2008 01:46AM UTC
Closed January 07, 2009 03:53AM UTC
Resizable + Draggable <img>
| Reported by: | neanton | Owned by: | braeker |
|---|---|---|---|
| Priority: | critical | Milestone: | 1.2.4 |
| Component: | ui | Version: | 1.2.3 |
| Keywords: | Cc: | ||
| Blocked by: | Blocking: |
Description
$(document).ready(function() {
$("img").resizable({ handles: 'all', containment: 'parent', stop: onResize }).draggable({ containment: 'parent', stop: onDrag });
});
This code doesn't work. Because on <img> the wrapper is created. I could make it work only by:
$(document).ready(function() {
$("img").resizable({ handles: 'all', containment: 'parent', stop: onResize }).parent().draggable({ containment: 'parent', stop: onDrag });
});
this code and it produces very buggy results under every browser.
Here's my HTML example:
<body bgcolor="gray">
<div id="photoeditor" style="width: 500px; height: 500px; background: white; margin: 0px;">
<img height="150" width="200" src="bliss.jpg" style="margin: 0px;">
</div>
</body>
For example:
1) in IE8 beta 1 when dragging image it jumps aprox 3 pixlels up and left;
2) in All browsers { containment: 'parent' } doesn't work for resizables;
3) in Opera on first movement the image could be dragged from the { containment: 'parent' } box for approx 3 pixels;