css - jquery ui: drag and drop - mouse selection incorrect -


i'm working on drag , drop navigation setup client.

i have drag , drop working (in basic form) when click on 1 of list items dragged actual droppable box coming though @ different location.

it's hard 1 explain without showing have online here: http://jsfiddle.net/elogicmedia/nvpyq/7/

css li , tags

li { color: black; list-style: none; padding: 1em 1em; } { position: absolute; text-decoration: none; border: 0px solid black; width:98px; height:98px; border-radius:50%; line-height:1.5em; text-align:center;     font-family: helvetica, arial;     background-color: #c0d9d9; } 

js drag , droppable code

// let gallery items draggable $( "li" ).draggable({   revert: "invalid", // when not dropped, item revert initial position   containment: "document",   helper: "clone",   cursor: "move" });    // let trash droppable, accepting gallery items $( "#droparea" ).droppable({   accept: "ul.gallery > li",   activeclass: "ui-state-highlight",   drop: function( event, ui ) {       alert('dropped');     //deleteimage( ui.draggable );   } }); 

also note borders right of fiddle, definaly not right there either. shouldn't there, circles. screenshot jsfiddle setup below.

thankyou

enter image description here

i ended working out myself.

the working result here:

http://jsfiddle.net/elogicmedia/nvpyq/12/

i trying drop li tags tags circles, boxes right li tags.

new drag , drop code

// let gallery items draggable $( "ul.gallery > li a" ).draggable({   revert: "invalid", // when not dropped, item revert initial position   containment: "document",   helper: "clone",   cursor: "move" });    // let trash droppable, accepting gallery items $( "#droparea" ).droppable({   accept: "ul.gallery > li a",   activeclass: "ui-state-highlight",   drop: function( event, ui ) {       alert('dropped');     //deleteimage( ui.draggable );   } }); 

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 -