Question

I use the following javascript (with jQuery) to handle drag and drop on a script I am writing:

jsc.ui.dragging = false; jsc.ui.drag_element = {}; $('.drag-target').mousedown(function() {     jsc.ui.drag_element =  $(this);     jsc.ui.dragging = true; }); $('html').mousemove(function(e) {     if(jsc.ui.dragging) {         jsc.ui.drag_element.css({'position': 'absolute', 'top': e.clientY - 1, 'left': e.clientX - 1, 'z-index': '100'}); // - 1s are due to IE not leaving go otherwise         $('#overlay').show(); // Overlay stops text beneath being selected. TODO Stop current elements text being selected.     } }); $('.drag-target').mouseup(function() {     if(jsc.ui.dragging) {         jsc.ui.dragging = false;         jsc.ui.drag_element.css('z-index', '98');         $('#overlay').hide();     } }); 

However when the object is being dragged, the text inside it has a flickering selection i.e. it is being selected on and off as the element is moved. Is there any way to prevent this, or hide it’s effect?

Answer 1

Is there a reason for not using jQuery UI Draggable ? Your code would look like that:

$('.drag-target').draggable(); 

You should at least check how it’s build, it may help you to solve you flickering problem.