Hola,
Tengo un div con elementos que puedo arrastrar a otros dos divs.
Quiero que cuando arrastre tres elementos a cada div, no me permita agregarle más.
El código que tengo, y que no me funciona bien, es el siguiente:
Código HTML:
<div class="demo">
<div id="content" >
<div class="item"><img src="1.jpg" name="1" title="elm1"></div>
<div class="item"><img src="2.jpg" name="2" title="elm2"></div>
<div class="item"><img src="1.jpg" name="3" title="elm3"></div>
<div class="item"><img src="2.jpg" name="4" title="elm4"></div>
<div class="item"><img src="1.jpg" name="5" title="elm5"></div>
</div>
<div class="fs" id="id1"></div>
<div class="fs" id="id2"></div>
</div> Código HTML:
$(".fs").sortable({
connectWith : '.fs',
revert: true,
helper: "clone",
receive: function(event, ui) {
if ($(this).children().length >= 3) {
$(this).sortable("cancel");
}
}
}).disableSelection();
$("#content .item").draggable({
connectToSortable: ".fs",
helper: "clone",
revert: "invalid"
})
Alguien me puede echar una mano?
Gracias