Ciao a tutti!

Ho fatto uno script che mi permette di spostere delle immagini dal bordo destro verso il bordo sinistro.
Però lo spostamento avviene troppo velocemente e non è visibile, come posso fare per rallentare lo spostamento in modo da visualizzare l'immagine in movimento?
Il codice che ho scritto è il seguente:
codice:
function gc(type){
    str="carta"+num_c;     
    el=document.getElementById(str);
    el.src=imgg[seme][num];
    el.style.visibility='visible';
    imgg[seme][num]="null";
    
   //type differenzia le carte che vanno sopra da quelle che vanno sotto
        if(type==1){
            el.style.top='50px';
            //position inizialmente vale 100
            position=bp;
        }
        else{
            el.style.top='350px';
            position=pp;
        }
            //sposto la carta

        x=parseInt(el.style.left);
        i=x;
        while(i>position){
            el.style.left=i+'px';
            i=i-1;
       }
        if(type==1)
            bp+=100;
        else
            pp+=100;
    //calcolo punteggio del giocatore o del banco
    if(type==1){
        b=b+assegna_valore(num);
        el=document.getElementById('banco');
        el=el.firstChild;
        el.nodeValue=b;

    }
    else{
        g=g+assegna_valore(num);
        el=document.getElementById('player');
        el=el.firstChild;
        el.nodeValue=g;
    }
}
La posizione iniziale delle immagini è 1000px. Uso firefox per testare le pagine.
Come posso rallentare il loro movimento?

Un grazie anticipato per tutti gli aiuti