Salve ragazzi,
scrivo perchè ho un problema su js che mi sta tormentando. Vorrei risolverlo quanto prima e credo che qui potrei trovare la risposta. Sto realizzando un sito per mio padre ed avrei finito eoni fa se non fosse per questo problema balordo che vi vado ad illustrare:
come base di partenza abbiamo un menu in flash e due <div> affiancati, definiti con id che chiameremo uno "principale" ed un altro "secondario", il menu è diviso in tot sezioni, ognuna delle quali apre nel div "principale" (diversificata per ogni sezione con colori e sfondo diverso mediante classi css) una breve introduzione ed una sorta di indice cliccabile dei sottocontenuti. Al click sulle voci di questo indice devo far apparire il div "secondario" con i dettagli e tutto il resto.
Volendo assolutamente evitare il refresh delle pagine durante la navigazione, ho optato per la possibilità di utilizzare chiamate asincrone per il caricamento dei contenuti e la manipolazione dei css mediante JQuery, il che sembrava aver dato i suoi frutti, almeno fino a quando non ho fatto le prime prove di resa sul server remoto, durante le quali ho potuto notare con sommo disgusto delle discrepanze notevoli di risultato dovute probabilmente ai tempi di caricamento delle immagini e delle informazioni... in pratica vedevo prima il nuovo contenuto e poi una frazione di secondo dopo il cambio della classe css. Ho dunque provato a giocare con la proprietà "visibility" del div, ottenendo quanto di seguito riportato, ma non sono sicurissimo di aver seguito la strada più corretta.
Volevo sapere se vi sembra corretto come approccio o se sto toppando alla grande. In quest'ultimo caso, sarei contento di ricevere indicazioni o possibili soluzioni
Premetto che javascript non lo conosco benissimo e sono qui per imparare da chi ne sa più di me, quindi non mi massacrate troppo se vedete strafalcioni
Grazie sin da ora a chiunque avrà modo e voglia di rispondere
* specifico che entrambi i div principale e secondario hanno la proprietà visibility settata ad hidden nel css di baseCodice PHP:
if (id == 1) {
// svuota dai contenuti e spegne il <div> "secondario"
$("#secondario").css({'visibility' : 'hidden'});
$("#secondario").removeClass().addClass("var_20");
$("#secondario").html("");
// modifica le informazioni del <div> "principale"
var newClass = "var_"+sez;
$("#principale").css({'visibility' : 'hidden'});
$('#principale').removeClass().addClass(newClass);
$.ajax ({
type: "GET",
url: "contenuti.php?r="+sez,
success: function(html) {
$("#principale").html(html);
$("#principale").css({'visibility' : 'visible'});
}
});
}
else if (id == 2) {
// inserirò qui la gestione dei contenuti del <div> "secondario"
}