Please ask on the jQuery UI list:
http://groups.google.com/group/jquery-ui/
- Richard
On Tue, Oct 28, 2008 at 11:28 AM, Mazureth <[EMAIL PROTECTED]> wrote:
>
> im trying to write a cork board type app for a site and im having a
> little trouble with the drag and drop. basically there are 2 divs
> (#picker, #board) that load on the page. the #picker div contains
> various images that the user can drag and drop onto the #board div.
>
> once an image has been dropped into the #board div i want to change it
> to a draggable element so the user can arrange all the image how they
> please.
>
> i can get all of that to work. however, using firebug to see whats
> happening, once i drop the image into the #board and then start to
> drag it around, i notice that the top and left properties of the img
> element listed above it in the div are also being affected. this
> shouldnt be happening.
>
> i also wrote some extra code to bring the image being dragged to the
> 'front' by setting its z-index+1 to the current highest z-index. this
> works fine when i havent dropped any new images onto the #board yet.
> all the images already in the #board become the top image. but the
> newly dropped images dont come to the front.
>
> here is the code right now:
> $(document).ready(function() {
> $(".dragImage").draggable({
> containment: 'parent',
> cursor: 'move'
> });
> $(".dropImage").draggable({helper: "clone"});
> $(".vizualize_container").droppable({
> accept: ".dropImage",
> activeClass: "droppable-active",
> hoverClass: "droppable-hover",
> drop: function(e, ui) {
> $(ui.draggable).attr({class: "dragImage
> ui-draggable"});
> $(ui.draggable).draggable({
> containment: 'parent',
> cursor: 'move'
> });
> $(this).append($(ui.draggable));
> }
> });
> });
> var zmax = 0;
> $('.dragImage').click(function() {
> $(this).siblings('.dragImage').each(function() {
> var cur = $(this).css('zIndex');
> zmax = cur > zmax ? $(this).css('zIndex') : zmax;
> });
> $(this).css('zIndex', (zmax*1)+1);
> });
>
> and here is a link to see it in action:
> http://www.tut.com/visualizer
>
