PROBLEMA Errore in Javascript

ImA13programmer

Nuovo Utente
125
0
Salve ragazzi,mi sto inoltrando più a fondo nel mondo di Javascript e sto facendo delle animazioni/movimenti degli elements.Ho riscontrato però quest errore in cui la function per il movimento del div,funziona una sola volta.Magari con il codice capirete meglio.Comunque sono sicuro che sia una non conoscenza mia,e non un errore di sintassi o altro.Ecco il codice. P.S. Il javascript l'ho scritto in un file con estensione js,quindi senza bisogno dei tag script.]
-HTML
Codice:
<html>
    <body>
       <div id='personaggio' ></div>
       <button onclick='move()'></button>
    </body>
</html>
-CSS
Codice:
#personaggio {
    width:100px;
    height:100px;
    border-radius:200px;
    border:solid 2px black;
    background-color:blue;
    position:absolute;            
}
-JAVASCRIPT
Codice:
function move() { 
     var p= document.getElementById('personaggio');
     p.style.left= p.style.left + 50;

}
Spero mi possiate aiutare
 

Mursey

Super Moderatore
Staff Forum
Utente Èlite
8,244
5,674
Il problema è l'istruzione di incremento del left.
La proprietà left dello stile è una stringa e al secondo giro contiene "50px", dopo la tua somma diventa "50px50" e quindi un valore non valido.

Devi usare : p.style.left = p.offsetLeft + 50 + "px";

La proprietà offsetLeft (di sola lettura) contiene il valore numerico.
Quindi a questo sommi il valore che vuoi e poi l'aggiunta di una stringa trasformerà il tutto in una stringa.

Magia dei tipi di Javascript :)
Per questo non è un buon linguaggio per imparare la programmazione...
 

ImA13programmer

Nuovo Utente
125
0
Il problema è l'istruzione di incremento del left.
La proprietà left dello stile è una stringa e al secondo giro contiene "50px", dopo la tua somma diventa "50px50" e quindi un valore non valido.

Devi usare : p.style.left = p.offsetLeft + 50 + "px";

La proprietà offsetLeft (di sola lettura) contiene il valore numerico.
Quindi a questo sommi il valore che vuoi e poi l'aggiunta di una stringa trasformerà il tutto in una stringa.

Magia dei tipi di Javascript :)
Per questo non è un buon linguaggio per imparare la programmazione...
Scusa se ti sto disturbando tante volte,ma ho bisogno di un altro aiuto.In pratica con un po' di ragionamento sono arrivato a fare delle animazioni con il ciclo for in Javascript,ma non riesco a fermare l'animazione!
HTML e CSS sono come prima,il seguente è il nuvo codice javascript
Codice:
function move() {
    
     function moveSec() {
       var p= document.getElementById('pers');
        
       for (i= 1;i<25; i++)  {
             p.style.left = p.offsetLeft + 1 + "px";
             p.style.top = p.offsetTop + 1 + "px";
            } 
     }
    setInterval(moveSec,1);
}
 

Entra

oppure Accedi utilizzando
Discord Ufficiale Entra ora!

Discussioni Simili