Scelta di immagine di sfondo

[fermat]

salve a tutti.
sto cercando di fare questo: creare una lista di immagini in modo l'immagine scelta dall'utente venga settata come background.
il mio problema principale è: come mostrare la lista di immagini senza usare script lato server?

[fermat]

ho risolto per ora con un semplic tag <select> con le varie <option> che si riferiscono alle immagini.

a questo punto però ho un problema col setaggio dello sfondo nel div con id.
parte dello script è questo:

function DispImg2 () {
    var expDays = 10;
    var exp = new Date();
    exp.setTime(exp.getTime() + (expDays*24*60*60*1000));
    var next;
    var Now = GetCookie('Now');
    var prev = document.bgs.image.value;
    if (Now != prev) {
        Now = document.bgs.image.value;
        SetCookie ('Now', Now, exp);
        for (i=1 ; i<=num ; i++) {
            if (Now == "img" + i){
                next = sfondo[i];
                i = num;
            }
        }
    
    }
    else {
        next = sfondo[1];
    }
    document.body.background= next;
}

così funziona ma mi cambia tutta la pagina.
allora ho provato a cambiare l'ultima riga così:
document.getElementsById("ciao").background = next;

ovviamente nn funziona.
come posso richiamare un id??

[cavicchiandrea]

Non funziona perché manca lo stile: document.getElementsById("ciao").style.background = next

[fermat]

neanche così funziona.
questa è la pagina:

......
<form name="bgs">
            <select name="image">
                <option value="img1">Default white</option>
                <option value="img2">Red</option>
            </select>
            <input type="button" name="button" value="Cambia BackGround" onclick="DispImg2()" />
        </form>
        


        <div id="ciao" style="width: 300px; border: 1px solid black;">
            ciao
        </div>
....

il colore di sfondo nn cambia lo stesso

[cavicchiandrea]

Non avevo verificato lo script, comunque verifica tutti i vari passaggi perché nella select hai delle stringe non dei colori

[fermat]

si però l'originale con document.body funziona.
posto l'originale così magari sapete dirmi cosa nn va:

// Configura il numero di Backgrounds disponibili
// (Set the number of Available Backgrounds)
num = 100;

// Creo un array con tutte le immagini
var sfondo = new Array()
sfondo[1] = "images/1.bmp";		// Background di Default (default BackGround)
sfondo[2] = "images/2.bmp";

function getCookieVal(offset) {  
    var endstr = document.cookie.indexOf (";", offset);
    if (endstr == -1) {
        endstr = document.cookie.length;
    }
    return unescape(document.cookie.substring(offset, endstr));
}

function DispImg () {
    var expDays = 10;
    var exp = new Date();
    exp.setTime(exp.getTime() + (expDays*24*60*60*1000));
    var next;
    var Now = GetCookie('Now');
    if (Now != null){
        for (i=1 ; i<=num ; i++) {
            if (Now == "img" + i){
                next = sfondo[i];
                i = num;
            }
        }
    }
    else {
        next = sfondo[1];
    }
    document.body.background = next; // dovrei cambiare qua
}

function DispImg2() {
    var expDays = 10;
    var exp = new Date();
    exp.setTime(exp.getTime() + (expDays*24*60*60*1000));
    var next;
    var Now = GetCookie('Now');
    var prev = document.bgs.image.value;
    if (Now != prev) {
        Now = document.bgs.image.value;
        SetCookie ('Now', Now, exp);
        for (i=1 ; i<=num ; i++) {
            if (Now == "img" + i){
                next = sfondo[i];
                i = num;
            }
        }
    }
    else {
        next = sfondo[1];
    }
    document.body.background = next; // dovrei cambiare qua
}

function GetCookie(name) {  
    var arg = name + "=";
    var alen = arg.length;
    var clen = document.cookie.length;
    var i = 0;
    while (i < clen) {
        var j = i + alen;
        if (document.cookie.substring(i, j) == arg) {
            return getCookieVal (j);
        }
        i = document.cookie.indexOf(" ", i) + 1;
        if (i == 0) {
            break;
        }
    }
    return null;
}

function SetCookie(name, value) {  
    var argv = SetCookie.arguments;
    var argc = SetCookie.arguments.length;
    var expires = (argc > 2) ? argv[2] : null;
    var path = (argc > 3) ? argv[3] : null;
    var domain = (argc > 4) ? argv[4] : null;
    var secure = (argc > 5) ? argv[5] : false;
    document.cookie = name + "=" + escape (value) + ((expires == null) ? "" : ("; expires=" + expires.toGMTString())) + ((path == null) ? "" : ("; path=" + path)) + ((domain == null) ? "" : ("; domain=" + domain)) + ((secure == true) ? "; secure" : "");
}

onload=DispImg;

[cavicchiandrea]

Ritengo che questo funzioni, ma quello che vuoi fare tu e diverso, e non basta cambaire qualcosa quà e la per risolvere, meglio se cerchi qualcosa di + specifico qui (sez. script)

[fermat]

bhe allora mi basterebbe questo:

$(document).ready(function(){
    $(".bg1").click(function(){
        $("li").css('background-image','url(images/1.bmp)');
    });
    $(".bg2").click(function(){
        $("li").css('background-image','url(images/2.bmp)');
    });
});

il problema è creare qualcosa che funzioni sopra anche per questo script.
nn posso inserire a mano tutti i colori.
devo crearmi un array, integrarlo la e poi creare i cookie.
ecco perchè cercavo di mettere a posto quello.

vabbè vedo un pò.
grazie!!