Pagina 1 di 2 1 2 ultimoultimo
Visualizzazione dei risultati da 1 a 10 su 11

Discussione: Scambio tra 2 immagini

  1. #1

    Scambio tra 2 immagini

    salve ragazzi! Sto creando una specie di giochino con delle palline, in questo gioco quando ci sono 3 palle vicine scoppiano e la fila di palle scende facendo spazio ad altre palle. In questo gioco si può anche fare lo "scambio" cioè cliccando una pallina e successivamente cliccando la pallina affianco esse si scambiano di posizione. Il mio problema è proprio nel scambiare di posizione, o meglio nel farlo visualizzare nella tabella che racchiude le palline. la funzione che ho usato per farle scambiare è:

    function scambio()
    {
    s=document.activeElement.id //prende coordinate della matrice della palla su cui clicco (es: 3&2)

    ss=s.split("&") // divide le coordinate in due coordinate distinte

    if(R==null)
    {
    R=ss[0]
    C=ss[1]
    }
    else
    {
    R2=ss[0]
    C2=ss[1]
    //scambio:

    scmb=matrice[R][C]
    matrice[R][C]=matrice[R2][C2]
    matrice[R2][C2]=scmb;

    R=null
    C=null
    }
    }

    In questo caso lo scambio me lo fa però non scambia le immagini ma solo le coordinate dell matrice! Come faccio a far scambiare anche le immagini??

  2. #2
    devi modificare l'attributo "src"

  3. #3
    In che senso?? dove lo devo modificare?

  4. #4
    Le immagini o le celle che le contengono hanno un id?

  5. #5
    si!

    ti do tutto il codice della pagina:

    <html>
    <head>
    <title>Gioco</title>
    </head>
    <style>
    td
    {
    width: 50px;
    height: 50px;
    }
    </style>
    <body>
    <script language="javascript">
    // variabili generali
    table=document.getElementById('ciao')
    img="palla"
    R=null
    C=null
    righe=8
    colonne=10
    numimm=6
    //creo matrice
    matrice=new Array(righe)
    for(r=0; r<righe; r++)
    {
    matrice[r]= new Array(colonne)
    }
    //inserisco
    for(r=0; r<matrice.length; r++)
    {
    for(c=0; c<matrice[r].length; c++)
    {
    matrice[r][c]=parseInt(Math.random()*numimm);
    }
    }


    function tabella()
    {
    //inserimento immagini
    var table=document.getElementById('ciao')
    for(r=0; r<matrice.length; r++)
    {
    var row=table.insertRow(-1);
    for(c=0; c<matrice[r].length; c++)
    {
    var cella=row.insertCell(-1);

    if(matrice[r][c]==0){
    immagine=img+matrice[r][c]+".png"
    ID='n'+c+'&'+r;}
    else
    {immagine=img+matrice[r][c]+".png"
    ID=c+'&'+r
    }

    cella.innerHTML='[img]+immagine+[/img]'+'<align="middle">';
    cella.id=ID;

    }
    }
    r=0;
    c=0;
    }


    function scambio()
    {
    s=document.activeElement.id //prende coordinate della matrice della casella su cui clicco (es: 3&2)
    alert(s)
    ss=s.split("&") // divide le coordinate in due coordinate distinte
    if(R==null)
    {
    R=ss[0]
    C=ss[1]
    }
    else
    {
    R2=ss[0]
    C2=ss[1]
    scmb=matrice[R][C]
    matrice[R][C]=matrice[R2][C2]
    matrice[R2][C2]=scmb;
    R=null
    C=null
    }
    }


    </script>

    <input type="button" onclick="tabella()" value="genera tabella">
    <table border id="ciao" onclick="scambio(this)">
    <tbody>
    </tbody>
    </table>

    </body>

    </html>

  6. #6
    se "s" è l'id della cella, puoi modificare l'immagine all'interno con:

    document.getElementById(s).getElementsByTagName('i mg')[0].src="images/image.jpg";

  7. #7
    In questo modo mi modifica solo una delle due immagine cioè la seconda che clicco perchè l'id che rimane è quello dell'ultima immagine cliccata però credo che sia la strada giusta

  8. #8
    ovviamente devi ripetere l'operazione per tutte e due le immagini...

  9. #9
    funziona ma non mette l'immagine che dovrebbe, è come se il numero nella cella che clicco cambiasse: per esempio clicco sull'immagine che corrisponde al numero 2 della matrice e se controllo col debugger matrice[R][C] c'è un numero diverso -.- Non capisco perchè cambia!!

  10. #10
    Cel'ho fatta grazie mille

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2026 vBulletin Solutions, Inc. All rights reserved.