[SOLUCIONADO] Jquery arrastrar y soltar

[trompi14]

Tengo un div con mucho texto y en él varias fotos colocadas al comienzo del texto.
Mi intención es arrastrar cada foto al comienzo o al final de los párrafos que componen el texto.

Hasta ahora lo único que he conseguido es arrastrar las fotos, pero se quedan encima del texto y no entre él.

He probado poniendo al div droppable, he puesto el texto en un span también con droppable y lógicamente a las fotos draggable.

Necesito ayuda. Gracias.

[PHPeros]

Sigue este ejemplo. Es necesario el preventDefault() y un par de cosas más.

[trompi14]

Gracias PHPeros.
Funciona, pero en el IExplorer 7 y 8 no. Parece que es HTML5 y yo lo necesito en Jquery.

[marlanga]

Pon en http://jsfiddle.net lo que lleves hecho. Y asegúrate que funciona "bien", elimina todo lo innecesario y pon exclusívamente todo lo relacionado con lo que tienes dudas. No pegues un chorizo que no haya dios que lo entienda.

[trompi14]

Gracias marlanga:

He probado lo que dices y tampoco funciona.

Este es mi código:

Esto en el head junto con las librerías jquery y jquery-ui:

Código:

	$(document).ready(function(){
		$('#foto').draggable({
           
        });
		$('#comentarios').droppable({
            accept: "#foto"});
	    });

Y esto en el body:

Código:

<div id="comentarios">
    <img id="foto" src="http://media.jukebox.es/a1846/i1846.jpg" border="0" align="left" style="margin-right:10px" />
   <span id="textocomentario">BONNIE TYLER<br /><br />
Gaynor Hopkins (nacida el 8 de junio de 1951 en Sweken, Neath, Gales), mejor conocida por su seudónimo artístico Bonnie Tyler. Es una cantante galesa, compositora, empresaria y filántropa activa. Dueña de una voz muy característica, como ronca o cascada.
<br /><br />
Comenzando como un cantante local en Swansea, Tyler saltó a la fama con el lanzamiento de su álbum de 1977 The World Starts Tonight y sus sencillos " Lost in France" y " More Than a Lover". Su cancion "It's a Heartache" fue un éxito a ambos lados del Atlántico, alcanzando el número uno en varios países europeos y rompiendo las listas de éxitos estadounidenses. Después de ganar el 10 º Festival Mundial de la Canción Popular con 1.979 single "Sitting on the Edge of the Ocean". Su carrera alcanzó su punto máximo en la década de 1980 con su colaboración Jim Steinman, lanzando éxitos internacionales "Total Eclipse of the Heart", "Holding Out ​​for a Hero", "If You Were a Woman and I Was a Man", "Here She Comes" y "Loving You's a Dirty Job but Somebody's Gotta Do It".
<br /><br />
En la década de 1990 tuvo un mayor éxito en Europa continental con sencillos como "Bitterblue" y "Fools Lullaby". Con el productor alemán Dieter Bohlen, Tyler había continuado éxito con tres álbumes antes de lanzar en el Reino Unido y Estados Unidos de nuevo, y su sencillo "Making Love Out of Nothing at All".
<br /><br />
Haciendo una reaparición a finales de 2003 en Francia, Tyler lanzó "Si demain ..." con Kareen Antonn, que fue número uno en Francia durante diez semanas, vendiendo más de 700.000 copias. En los últimos años ha aparecido en varios programas de televisión del Reino Unido, hizo un cameo en la telenovela británica Hollyoaks. Mas tarde estuvo de gira con el fallecido cantante Robin Gibb en 2010 y con Status Quo en 2012. Su ultimo álbum "Rocks And Honey" tuvo un éxito moderado en Europa, con su sencillo "Believe In Me" con el cual represento al Reino Unido en el Festival de la Canción de Eurovisión, quedando en el puesto 19 con 23 puntos. Posteriormente Tyler gano el premio ESC Radio como la mejor canción y la mejor artista femenina, marcándola como el primer representante del Reino Unido en recibir dos premios. sus últimos sencillos, "This Is Gonna Hurt" y "Love Is the Knife" acaban de ser lanzado en agosto y septiembre de 2013, respectivamente, y ella acaba de terminar su tour Sudáfrica 2013.
<br /><br />
Tyler ha colaborado con varios cantantes incluyendo Cher, Meat Loaf, Mike Oldfield, Frankie Miller, Vince Gill y Andrea Bocelli y lanzado más de 30 sencillos a dúo desde 1983.
<br /><br />
Con una carrera que abarca casi cuatro décadas, ha ganado tres premios Goldene Europa, un Premio Echo, y ha sido nominado a tres premios Brit y tres Premios Grammy. Su distintiva voz ronca, como resultado de una operación para extirpar los nódulos vocales, ha tenido ella la comparación con artistas como Rod Stewart y Kim Carnes, y en combinación con su éxito profesional, se ha dado a conocer como la "La Primera Dama del Rock internacional".
frentamiento.</span>
</div>

[PHPeros]

Te falta al droppable añadir lo que pasa cuando sueltas el elemento (clonarlo y situarlo):

Código Javascript:

$("#foto").draggable({
helper: "clone", 
start: function(e, ui){ 
$(ui.helper).addClass("ui-clase"); 
} 
});
 

Código CSS:

.ui-clase{
background-image: URL IMAGEN;
}
 

[trompi14]

Pero cómo la sitúo, por ejemplo, al principio de otro párrafo.
Ahora mismo al soltar la imagen desaparece y sigue estando el original en su sitio.

He corregido el draggable y el css tal como me indicas, pero y el droppable ¿hay que añadirle algo?

Llevo no sé cuántos días y cuántas páginas leídas y no soy capaz.
Muchas gracias.

[marlanga]

http://jsfiddle.net/marlanga/2y5Nn/3/
Mira bien los cambios que he hecho en el html.

[trompi14]

Muchas gracias a PHPeros y a Marlanga.

Funcionan los cambios de Marlanga.

Intentaré con los cambios oportunos la alineación a izquierda o derecha de la foto.

Otra cosa que debo salvar es que el texto es introducido por los usuarios en un textarea y los saltos de línea no me llegarán con la etiqueta <p> sino con <br>. Lo ideal es que fuera con <p> de párrafo. Lo intentaré y si no lo consigo ya lo expondré para que me ayudéis.

Un abrazo a todos.