Hola a todos, tengo un problema como dice el título con el drag and drop de jquery.
Estoy copiando tal cual el primer ejemplo de esta página del sitio oficial de jquery
http://ui.jquery.com/latest/demos/functional/#ui.droppable
Código HTML:
<head>
<title>Documento </title>
<script src="jquery.js" type="text/javascript"></script>
<script src="ui.core.js" ></script>
<script src="ui.draggable.js" ></script>
<script src="ui.droppable.js" ></script>
<script language="JavaScript" type="text/javascript">
$(".droppable-photos-container").droppable({
accept: ".img_content",
drop: function(ev, ui) {
ui.draggable.clone().fadeOut("fast",
function() {
$(this).fadeIn("fast")
}).appendTo($(this).empty());
}
});
</script>
<style type="text/css">
<!--
.droppable-photos-container {
position:absolute;
left:350px;
top:172px;
width:80px;
height:80px;
z-index:1;
background-color:#0099CC;
}
.droppable-img-content {
width:80px;
height:80px;
}
.droppable-gallery {
list-style: none;
}
-->
</style>
</head>
<body>
<div id="droppablePhotos" style="min-height: 130px; min-height:130px; height:auto !important; zoom:1;">
<ul class="droppable-gallery">
<li class="droppable-img-content">
<img src="objetos/imagen.JPG" alt="Tatry 1" title="Drag me!" />
</li>
<li class="droppable-img-content">
<img src="objetos/imagen2.JPG" alt="Tatry 3" title="Drag me!" />
</li>
<li class="droppable-img-content">
<img src="objetos/imagen3.JPG" alt="Tatry 4" title="Drag me!" />
</li>
</ul>
<div class="droppable-photos-container" style="text-align: center;">Drop here!</div>
</div>
</body> Solo añado el css.
El problema es que hace el drag pero no el drop.
He probado cambiando esta line que es lo único q veo raro :
por
Cita: accept: ".droppable-img-content",
pero hace lo mismo, el drag pero no el drop.
Supongo que el error esta en lo unico que he añadido yo, pero no se, alguna sugerencia?
gracias de antemano !
las librerias para que no las tengais que buscar si no las teneis a mano están aquí
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script src="http://dev.jquery.com/view/tags/ui/latest/ui/ui.core.js"></script>
<script src="http://dev.jquery.com/view/tags/ui/latest/ui/ui.draggable.js"></script>
<script src="http://dev.jquery.com/view/tags/ui/latest/ui/ui.droppable.js"></script>