drag drop

zighy · 20 Gen 2012

Scusate l'ignoranza ma la mia conoscenza del java è limitata a piccole modifiche, sulle funzioni sono ancora un po confuso ma veniamo al sodo; ho quasto script:

https://www.mrw.it/javascript...dhtml_465.html

In pratica mi permette di usare la tecnica del drag and drop su un div con id=M e funziona benissimo.Quello che vorrei fare è aggiungere altri 2 elementi che posso 'draggare'
Mi date una mano perfavore...

alessandro1997 · 20 Gen 2012

Un consiglio: usa jQuery UI. Ti basta una riga di codice per farlo:

Codice:

$("#div1, #div2, #div3").draggable();

Dai un'occhiata qui.

zighy · 20 Gen 2012

sembra interessante quanto piu complicato di quel codicino semplice da me postato...vedo se ci capisco qualcosa...ma cerco cmq altre idee

zighy · 20 Gen 2012

Boooooooooooh....qualcuno riesce ad aiutarmi sul serio?

alessandro1997 · 20 Gen 2012

Avverto una vena polemica. Ti ricordo che sei libero di chiedere in un altro forum, dove sicuramente troverai gente competente e professionale, capace di aiutarti "sul serio". Noi dopotutto siamo un modesto branco di zoticoni ignoranti.

Inoltre, vuoi farmi la cortesia di spiegare cosa c'è di così infinitamente complicato nell'includere due file Javascript, e nello scrivere una riga di codice invece di dieci? La mia mente limitata non afferra il concetto, purtroppo.

Aggiungo che sei la spiegazione vivente del perché non esistono webmaster italiani davvero competenti: sono sempre tutti a cercare la via più facile anche se è la meno utile e performante, e considerano chiunque proponga loro di fare le cose in maniera diversa (magari perché ha più esperienza?) un imbecille.

jQuery è un framework Javascript che rende il codice più semplice da scrivere e da manutenere in futuro, senza contare che lo rende completamente cross-browser. jQuery UI, basato su jQuery, è un framework per la realizzazione di splendide interfacce grafiche che adottano effetti come il drag'n'drop.

max_400 · 21 Gen 2012

Ciao Zighi e benvenuto sul forum

lo script che hai postato è incompleto e il tag finale è sbagliato manca lo slash
ma più in particolare manca la parte css e la parte html con l'elemento da trascinare
tu dici che ti funziona benissimo ed ho visto da dove l'hai preso

https://www.mrw.it/javascript/articoli/effetto-drag-and-drop-dhtml_465.html
qui è scritto completo

A me però non funziona forse perchè uso Firefox ma provabilmente con un altro browser funziona

Ecco qui un esempio di trascinamento di più oggetti in modo semplice e veloce

http://max400.netne.net/drag-con-firefox-di-piu-oggetti.html
Ovviamente Testato con browser Firefox

Questo è il codice:

Codice:

<head>
<style type="text/css"> .dragme{position:relative;cursor: pointer; cursor:hand}</style>

<script type="text/javascript">
var ie=document.all;
var nn6=document.getElementById&&!document.all;
var isdrag=false;
var x,y;
var dobj;

function movemouse(e){
if (isdrag){
dobj.style.left = nn6 ? tx + e.clientX - x : tx + event.clientX - x;
dobj.style.top = nn6 ? ty + e.clientY - y : ty + event.clientY - y;
return false;
}
}

function selectmouse(e){
var fobj = nn6 ? e.target : event.srcElement;
var topelement = nn6 ? "HTML" : "BODY";
while (fobj.tagName != topelement && fobj.className != "dragme"){
fobj = nn6 ? fobj.parentNode : fobj.parentElement; }
if (fobj.className=="dragme"){
isdrag = true;
dobj = fobj;
tx = parseInt(dobj.style.left+0);
ty = parseInt(dobj.style.top+0);
x = nn6 ? e.clientX : event.clientX;
y = nn6 ? e.clientY : event.clientY;
document.onmousemove=movemouse;
return false;
}
}

document.onmousedown=selectmouse;
document.onmouseup=new Function("isdrag=false");

</script>

<body>

<img src="tuafoto1.jpg" width="200" height="220" class="dragme"> - 
<img src="tuafoto2.jpg" width="200" height="220" class="dragme">

</body>

Se devi aggiungere altre foto non modificare il codice javascript e neanche il css.
Non devi fare altro che aggiungere altre foto nella parte in HTML sotto il tag Body.
Poi per modificare il cursore del mouse sopra la foto tipo la manina
cursor: pointer; cursor:hand

Zighi correggi il tuo script e metti quello completo o devo rimuoverlo!

Per Alessandro: in tutte le cose ci vuole pazienza. Non te la prendere.

Grazie per la collaborazione.

Er Moderator
by Max_400

alessandro1997 · 21 Gen 2012

In tutte le cose ci vuole anche umiltà, e io non ne posso più di fare sempre la stessa predica.

zighy · 22 Gen 2012

Alessandro in primo luogo non credo di aver dato dell'imbecille a nessuno,ho solo scartato la soluzione che mi avevi 'proposto' perchè sulla mie pagine opero come credo sia meglio io,se chiedo un consiglio non è detto che poi lo debba seguire per forza,credo che anche una mente limitata posso arrivare a capirlo.
Max la tua soluzione invece mi pare ottima e lo script l ho preso dove hai detto tu:
https://www.mrw.it/javascript...dhtml_465.html
Ma dovrei implementare la memorizzazione degli elementi con la possibilita di fare delle modifiche..

max_400 · 22 Gen 2012

Ma dovrei implementare la memorizzazione degli elementi con la possibilita di fare delle modifiche..

Cos intendi esattamente? memorizzare la posizione?

zighy · 22 Gen 2012

Ti spiego,lo script che mi hai postato tu l ho modificato in modo che a poter essere trasportati siano dei nomi,piu'precisamente di calciatori che vengono spostati su un immagine di un campo di calcio.Quando pero'aggiorno la pagina gli elementi tornano al loro punto di partenza io invece vorrei restassero dove li posizioni magari con la possibilita'di fare modifiche qualora lo volessi.
Sto provando a salvare l'immagine con php ma nn credo sia la soluzione ideale a questo punto.

max_400 · 22 Gen 2012

Hai 2 alternative...

O memorizzi la posizione utilizzando php o un qualsiasi linguaggio lato server
oppure memorizzando la posizione nei cookie.

In javascript è un po' complicato tempo fa ho fatto una cosa del genere però in Flash.
Anche Flash ha i suoi cookie però quello che memorizzi lo vedi solo tu.. al livello soggettivo.

Se devi far vedere lo schema ad altre persone ti serve per forza il linguaggio lato server
non vedo altri modi...quindi avendo risolto qui lo start drag dovresti aprire una discussione
nella sezione php.

zighy · 23 Gen 2012

Grazie sei stato gentilissimo,adesso stavo provando da solo, con i cookie appunto oppure cercando di memorizzare le posizioni con Mysqul,vedo un po quale mi torna meglio e poi apriro'una discussione nella sezione giusta per risolvere eventuali problemi

Cerca

Cerca

drag drop

zighy

Utente Attivo

alessandro1997

Utente Attivo

zighy

Utente Attivo

zighy

Utente Attivo

alessandro1997

Utente Attivo

max_400

Utente Attivo

alessandro1997

Utente Attivo

zighy

Utente Attivo

max_400

Utente Attivo

zighy

Utente Attivo

max_400

Utente Attivo

zighy

Utente Attivo

Discussioni simili