Jquery trascinabili(), clone() per aggiungere div ... Pls Fiddle mia jsfiddle

UPDATE:Jquery trascinabili(), clone() per aggiungere div ... Pls Fiddle mia jsfiddle

http://jsfiddle.net/wJUHF/7/
Questa è la versione aggiornata e violino di lavoro per tutti coloro che possono leggere questo.

Sto cercando di far funzionare questo jfiddle.

qui è dove si trova il problema. Posso trascinare l'immagine nel contenitore. Aggiunge un clone, senza problemi. Quando clicco per trascinare l'immagine clonata nel contenitore funziona correttamente la prima volta. La seconda volta che clicco per trascinare, non trascina ma clona l'immagine già clonata. Per capire meglio, ho creato un jsfiddle. per favore dai un'occhiata e fammi sapere dove sto andando male qui.

http://jsfiddle.net/wJUHF/

Grazie

CODICE:

$(function(){ 
    //Make every clone image unique. 
    var counts = [0]; 
    $(".dragImg").draggable({ 
     helper: "clone", 
     //Create counter 
     start: function() { counts[0]++; } 
    }); 

    $("#dropHere").droppable({ 
     drop: function(e, ui){ 
      $(this).append($(ui.helper).clone()); 
      //Pointing to the dragImg class in dropHere and add new class. 
      $("#dropHere .dragImg").addClass("item-"+counts[0]); 
      //Remove the current class (ui-draggable and dragImg) 
      $("#dropHere .item-"+counts[0]).removeClass("dragImg ui-draggable ui-draggable-dragging"); 
      //not working 100%   
      $(".item-"+counts[0]).dblclick(function(){ 
       $(this).remove(); 
      });  

      //make the div draggable --- Not working???  
      make_draggable($(".item-1"));    
     } 
    }); 

    var zIndex = 0; 
    function make_draggable(elements) 
    { 
     elements.draggable({ 
      containment:'parent', 
      start:function(e,ui){ ui.helper.css('z-index',++zIndex); }, 
      stop:function(e,ui){} 
     }); 
    } 
});

HTML:

<body> 
    <div class="dragImg"><img src="http://placehold.it/80x80"> 
    </div> 
    <div id="dropHere"></div> 
</body>

CSS:

#dropHere { 
    width:400px; 
    height: 400px; 
    border: dotted 1px black; 
}

.210

fonte

2013-08-28 n00bInNeed

Grazie risparmiare la mia giornata. –

Hai solo bisogno di un condizionale per differenziarsi nel gestore goccia:

if(ui.draggable.hasClass("dragImg")) 
    $(this).append($(ui.helper).clone());

fonte

2013-08-28 20:15:03

Lavorato, grazie per l'aiuto :) Aggiungo il jsfiddle aggiornato una volta fatto. – n00bInNeed

jQuery(".dragImg").draggable({ 
     // use a helper-clone that is append to 'body' so is not 'contained' by a pane 
     helper: function() { 
      return jQuery(this).clone().appendTo('body').css({ 
       'zIndex': 5 
      }); 
     }, 
     cursor: 'move', 
     containment: "document" 
    });

SOLVED UR PROBLEM JSFIDDLE DEMO

fonte

2013-08-28 20:42:12

Grazie per l'aiuto e lo sforzo. – n00bInNeed

Jquery trascinabili(), clone() per aggiungere div ... Pls Fiddle mia jsfiddle

risposta

Problemi correlati