javascript - Can I display:none part of a jQuery UI draggable and still keep the cursor in place somehow? -


i have number of draggables images in them want drop folders. conserve space (and make more draggables visible on screen @ 1 time), i'm hiding images css during drag. how can keep mouse on draggable when images disappear?

here's example of i'm seeing, using simple draggable box:

$( "#draggable" ).draggable({     revert: "invalid",     cursor: "move",     scroll: false,     cursorat: { top: 5, left: 5 },     start: function(event, ui) {         $('img').addclass('hidden');     },     stop: function(event, ui) {         $('img').removeclass('hidden');     } }); 

http://jsfiddle.net/fbpdf/

the hidden class uses display:none; hide images. can see in fiddle, dragging first image works fine, , mouse tracks along in upper left-hand corner of box while drag. when drag second, mouse floats off side because cursorat value has been set when images removed.

i'd prefer not use helper clone (because makes move more copy), that's way i've found far make work. tried resetting cursorat inside timeout in start function, didn't seem have effect.

is there way keep cursor , draggable somehow?

try change opacity. hidden attr off element "index".

.hidden {     opacity: 0; } 

http://jsfiddle.net/eegtl/


Comments

Popular posts from this blog

linux - xterm copying to CLIPBOARD using copy-selection causes automatic updating of CLIPBOARD upon mouse selection -

c++ - qgraphicsview horizontal scrolling always has a vertical delta -