Allora non avrai mica pensato che avrei lasciato tutto il divertimento solo a te....
Ho pescato in internet un codice per una semplice funzione (che in questo caso tratta di if ed else) che dovrebbe rendere bene
l idea di quello che intendo.
Ora te la metto giu nel suo modo originale:
<html>
<head>
<script>
<!--
function confronto(form){
if (form.a.value && form.b.value)
{
if (form.a.value==form.b.value)
form.c.value="uguali"
else //se non sono uguali....
form.c.value="diversi"
} //Conclude tutte le azioni
else //
alert("devi inserire i valori")
}
-->
</script>
</head>
<body>
<form name="d" action="#">
<b>A</b> <input size="10" name="a"><br>
<b>B</b> <input size="10" name="b"><br>
<textarea name="c" rows="1" cols="10"></textarea><br>
<input onclick=confronto(this.form); type="button" value="Aziona la funzione confronto"><br>
<input type="reset" value="Reset" name="cancella">
</form>
<body>
</html>
come puoi notare nelle due caselle possono essere inseriti dati qualsiasi, nomi o numeri o lettere, se i valori sono uguali viene il messaggio "uguali" altrimenti se non lo sono compare il messaggio "diversi".
Ora ti ripropongo lo stesso codice con la mia modifica:
<html>
<!DOCTYPE html>
<html>
<head>
<script>
<!--
function confronto(form){
if (form.a.value && form.b.value)
{
if (form.a.value==form.b.value)
form.c.value="uguali"
else
document.getElementById("dietro").style.display="block";
document.getElementById("dietro2").style.display="none";
} //Conclude tutte le azioni
else
alert("devi inserire i valori")
}
-->
</script>
<style>
#dietro{
display:none;
position: absolute;
top:200px;
left:500px;
height20px;
width:20px;
background-color:black;
}
</style>
<style>
#dietro2{
display:block;
position: absolute;
top:200px;
left:600px;
height20px;
width:20px;
background-color:red;
}
</style>
</head>
<body>
<div id="dietro">ciao</div>
<div id="dietro2">ciao</div>
<form name="d" action="#">
<b>A</b> <input size="10" name="a"><br>
<b>B</b> <input size="10" name="b"><br>
<textarea name="c" rows="1" cols="10"></textarea><br>
<input onclick=confronto(this.form); type="button" value="Aziona la funzione confronto"><br>
<input type="reset" value="Reset" name="cancella">
</form>
</body>
</html>
Come potrai notare ho sostituito la frase "diversi" con un doppio cambio di id tramite javascript,
se non metti i valori uguali avremo la scomparsa del div rosso e la comparsa del div nero.
Praticamente vorrei capire se tramite localstorage posso fare una cosa del genere...creare con setitem un valore tipo "uno"
poi nel tasto del segnalibro creare una serie di coppie di valori, zero(il menu)-uno, zero-due, zero-tre, etc...
con if ed else o con un array verra cercata la coppia corrispondente al valore impostato con il setitem e cosi entrera in funzione il getitem che eseguira le modifiche sui due getElementById corrispondenti..
Spero cosi che il tutto sia un po piu chiaro(perche credo prima abbia un po caotizzato la cosa), io continuo a fare esperimenti e ricerche ma se a te viene o conosci gia un modo per imlementare il localstorage con questo tipo di situazione sarebbe veramente il massimo!
Grazie di tutto e Buonanotte!