Visualizzazione risultati 1 fino 7 di 7

Discussione: Come gestire la visualizzazione di più elementi contemporaneamente.

  1. #1
    giocosentino non è connesso Neofita
    Data registrazione
    23-04-2011
    Messaggi
    11

    Predefinito Come gestire la visualizzazione di più elementi contemporaneamente.

    Salve, stò scrivendo autonomamente il codice del mio sito personale. L'idea era quella di fare qualcosa di estremamente semplice. Ed essendo realmente semplice pensavo, invece di fare più pagine linkate tra loro, creare più elementi, in un unica pagina, da visualizzare o nascondere a secondo di quale si vuole navigare. In passato ho già fatto qualcosa del genere ma con jquery. Ma, per rimanere nel semplice, cercavo un metodo meno complicato. Ho visto che è possibile controllare la visualizzazione di un elemento anche con javascript ma non sono riuscito a capire se è possibile farlo con più elementi contemporaneamente. E se si, come scrivere il codice. Qualsiasi aiuto è benaccetto e vi ringrazio anticipatamente.

  2. #2
    L'avatar di alemoppo
    alemoppo non è connesso Staff AV
    Data registrazione
    24-08-2008
    Residenza
    PU / BO
    Messaggi
    22,064

    Predefinito

    Non ho capito, intendi una cosa del genere?
    Codice HTML:
    <!DOCTYPE html>
    <html>
    <head>
      <meta charset="utf-8">
      <title>Test elementi nascosti</title>
      <style type="text/css">
      div {height:200px; width: 200px;}
      #num1{background-color:#F00}
      #num2{background-color:#0F0}
      #num3{background-color:#00F}
      </style>
      <script type="text/javascript">
      window.onload = function()
      {
    	document.getElementById('cliccami').addEventListener("click", function(){
           document.getElementById('num1').style.display = "none";
           document.getElementById('num3').style.display = "none";
        });
      }
      </script>
    </head>
    <body>
    <div id="num1">Elemento 1</div>
    <div id="num2">Elemento 2</div>
    <div id="num3">Elemento 3</div>
    <button id="cliccami">nascondi 1 e 3</button>
    </body>
    </html>
    Ciao!

  3. #3
    giocosentino non è connesso Neofita
    Data registrazione
    23-04-2011
    Messaggi
    11

    Predefinito

    Si, però nel tuo codice entrambi i div sono visualizzati nello stesso modo, mentre uno rimane inalterato e quindi visibile. Quello che volevo sapere era se potevo modificare a mio piacimento le varie visualizzazioni. Anche se forse potrebbe funzionare anche così dovrei fare una prova. In rete di solito si trovano solo esempi che comprendono una sola funzione. E quindi non riesco a capire come scrivere correttamente il codice. Comunque grazie.

  4. #4
    L'avatar di alemoppo
    alemoppo non è connesso Staff AV
    Data registrazione
    24-08-2008
    Residenza
    PU / BO
    Messaggi
    22,064

    Predefinito

    Quello era solamente un esempio, se hai capito il codice puoi modificarlo per fa apparire/sparire qualsiasi elemento, in qualsiasi numero di elementi.

    Ciao!

  5. #5
    giocosentino non è connesso Neofita
    Data registrazione
    23-04-2011
    Messaggi
    11

    Predefinito

    Scusami se ti rispondo soltanto adesso ma sono stato impegnato e non ho avuto proprio il tempo. Allora la cosa funziona MA avrei la necessità di inserire i <button> in un menu che viene visualizzato all'interno di elementi div. E in questo modo non funziona più. E' possibile che sia io a fare qualche errore ma purtroppo non ne riesco a capire quale. Ho l'impressione che possa essere l'evento "window.onload" che carica la funzione una sola volta mentre, probabilmente, sarebbe necessario ricaricarla ogni volta che viene fatta una scelta premendo un <button>. Spero di essermi spiegato.

  6. #6
    L'avatar di alemoppo
    alemoppo non è connesso Staff AV
    Data registrazione
    24-08-2008
    Residenza
    PU / BO
    Messaggi
    22,064

    Predefinito

    L'evendo onload viene appunto eseguito ogni volta che si carica la pagina (quindi solo una volta).

    Per aggiungere eventi (come un click), usa addEventListener.

    Ciao!

  7. #7
    giocosentinoblog non è connesso Utente AlterBlog
    Data registrazione
    16-05-2018
    Messaggi
    21

    Predefinito

    Come non detto era tutta colpa mia, cercavo disperatamente di complicarmi la vita. Invece funziona tutto alla meraviglia. Grazie!!!!

Regole di scrittura

  • Non puoi creare nuove discussioni
  • Non puoi rispondere ai messaggi
  • Non puoi inserire allegati.
  • Non puoi modificare i tuoi messaggi
  •