Non so cosa scrivere nel titolo... Credo mi serva uno script

[19Natale83]

Ciao a tutti!
Penso sia possibile, seppur complicato...
Vorrei nel mio sito (in XHTML) che uno spolier sia visibile solo dopo aver cliccato un punto preciso (che devo decidere io) della pagina.
Si può fare?
Grazie!

[Andy94]

Con Javascript senz'altro...
Fammi capire meglio: tu hai dei contenuti all'interno di un contenitore (o anche un tag di testo, ma sarebbe meglio saperlo con precisione) che vuoi mostrare solo dopo che l'utente clicca su un determinato elemento (che sarebbe il caso di sapere quale)?

Se così fosse, dimmi anche se usi già un Framework JS (MooTools, JQuery) e vedrò di aiutarti.

[19Natale83]

Andy, non so spiegarmi bene, quindi scarica il file .rar e leggi ciò che ho scritto nell'index, così hai un esempio diretto di ciò che mi piacerebbe fare.
Grazie!

[Andy94]

Allora, ho capito perfettamente quello che vuoi fare.
Ho anche derivato che utilizzi JQuery come Framework Javascript, perché ti viene importato assieme agli altri file necessari per il funzionamento del menu a tendina (se ti interessano maggiori informazioni sull'argomento, visita questa pagina della Wikipedia in Inglese).

Comunque, utilizzando sempre JQuery, ti ho creato uno script che devi aggiungere all'interno dell'head della pagina, immediatamente prima della sua chiusura (quindi prima di </head>).

Codice: Seleziona tutto

<script type="text/javascript">
      <!--
         //Attendo il caricamento del DOM
         $(document).ready(function(){
            //Imposto l'evento in modo che si scateni solo al momento della pressione del div tutte_sez
            $("#tutte_sez").bind("click", function(e){
               //Se il tab_sezioni si vede (primo caso) lo nascondo, altrimenti lo imposto come visibile (secondo caso)
               if($("#tab_sezioni").css("display")=='none'){
                  $("#tab_sezioni").css("display", "block");
               } else {
                  $("#tab_sezioni").css("display", "none");
               }
            });
         });
      -->
   </script>

Ho cercato di commentartelo al meglio, ma vista la semplice sintassi di JQuery non credo ci sia molto da spiegare. Comunque, se hai bisogno di ulteriori chiarimenti, anche per curiosità, non esitare a chiedere.

Un'altra cosa da fare, per il corretto funzionamento del menu sarebbe quella di impostare come nascosto il div che contiene le sezioni (perché altrimenti cosa abbiamo fatto a fare questo menu? Quindi, modifica la riga

Codice: Seleziona tutto

<div id="tab_sezioni">

in

Codice: Seleziona tutto

<div id="tab_sezioni" style="display: none;">

e prova la pagina.

Per qualunque cosa, comunque, io sono qui.

[19Natale83]

Andy, è proprio ciò che volevo!!! Bellissimo!
Per favore, mi diresti tutti i linguaggi che dovrei imparare per creare script simili? Sappi che io conosco (ma giusto le basi) solo l'(x)html...
E dimmi, rispetto all'(x)html, sono linguaggi più difficili da capire e applicare o presentano la stessa difficoltà?
Grazie mille per tutto!

[Andy94]

Beh, quello viene realizzato semplicemente mettendo insieme le competenze di base di Javascript e i comandi offerti dai framework come Mootools o nel tuo caso JQuery.

Sono sicuramente più complessi dell'XHTML, perché comunque si tratta di linguaggi che, al contrario di quelli statici, richiedono un po' di brainstorming e di idee per mettere in pratica quanto richiesto.

Per iniziare ad imparare JS, che nel tuo caso è il linguaggio utilizzato, bastano alcune guide online oppure un libro della catena O'Reilly (in inglese). Poi, appena aquisite le competenze di base (cicli if e for, sintassi di base) puoi cominciare ad analizzare un framework semplice, come Mootools o JQuery.

[dararag]

scusami andy, ma, anche se fa la stessa cosa, non sarebbe possibile usare anche il javascript normale, scrivendo una funzione tipo questa, richiamata dall'Onclick?

function mostra_nascondi(id) {
if (document.all)
{
var element = document.getElementById(id);
if (element.style.display == "none")
{
element.style.display = "block";
}
else
{
element.style.display = "none";
}
}
}

PS:Comunque, per iniziare, io trovo ottimi anche quelli della pocket collection, in fondo parliamo delle basi, e per avere solo quelle, approfondendole poi su internet trovo inutile spendere decine di euro quando ne bastano sette e cinquanta

[Andy94]

Qualora sia disponibile, non vedo perché non utilizzare la sintassi del framework, visto che è già importato da altri tool utilizzati nella pagina.
Certo, quello che hai mostrato tu ha una sintassi puramente in Javascript, ottima per imparare.

[dararag]

no, era per sapere, visto che in javascript sto praticamente cominciando solo ora seriamente, se era possibile farlo così oppure solo tramite i framework, e comunque, potrà sempre servire a qualcuno a cui non piacciono i framework, non li può usare... o roba così insomma