First of all, let me say, thank you for putting some effort into a
demo/issue page that is very easy to follow and use. Beautiful.
It looks like it's disappearing because you've set the draggable option
zIndex to -1. Not that I blame you - when that isn't set, the image isn't
clipped during dragging (it appears on top of, not inside the clip
container). The Interface.draggable documentation mentions the following
option:
"*insideParent* (Boolean): Forces the element to remain inside its parent
when being dragged (like Google Maps)"
Not exactly sure what that means, though the mention of google maps is
encouraging. I didn't have any luck with it. What I did get to work is to
set the img url as the background of the canvas div:
div#avatar_canvas { background: no-repeat url(bleach_blade_00.jpg); ... }
then I replaced the child img (div#avatar_canvas img) with an empty div with
the same width and height as the image. Then I put this in the onDrag
handler:
$('div#avatar_canvas').css('background-position', x + 'px ' + y + 'px ');
It's a bit of a hack (takes a bit more to set-up, you're not actually
dragging an img), but it works. We should make sure this works/gets fixed in
jQuery UI Draggables (still in dev).
- Richard
On 7/28/07, c4st <[EMAIL PROTECTED]> wrote:
>
>
> I'm working on a little feature for one of my projects and Iv'e ran
> into a little JavaScript related issue. I know that the Eyecon's "
> Interface Draggables" is not a part of jQuery, but I'm hoping someone
> here has had the same issue. Pretty much when I start to drag an img
> element it disappears. I've tried replacing the img element with a
> div, setting the background to the img src, and width and height to
> that of the image. It appears to me that any element I use it
> disappears while dragging it. Could the possible issue be the fact
> that the draggable overflow in a parent container?
>
> You can view the site/issue with all my source here:
>
> http://65.40.119.15/labs/file/file.php?image=http://darren.wiinix.com/games/bleach/bleach_blade_00.jpg
>
>
