Pagina 1 di 2 1 2 ultimoultimo
Visualizzazione dei risultati da 1 a 10 su 11

Discussione: Cambiare contenuto Div

  1. #1
    Utente di HTML.it
    Registrato dal
    Feb 2013
    Messaggi
    11

    Cambiare contenuto Div

    Ho trovato questo codice utilissimo e sto cercando di modificarlo, potete aiutarmi?
    Vorrei creare sei pulsanti con sei contenuti diversi, e quindi ovviamente più variabili da scrivere in javascript, ma ad un certo punto mi da errore, riuscite ad aiutarmi?
    Non conosco bene il linguaggio Java quindi non saprei come fare... Grazie!!!

    <html>
    <head>
    <script type="text/javascript" language="Javascript">
    <!--

    function mostraMenu(idcliccato) {

    if(idcliccato=='menu1') {
    var idnoncliccato_1 = 'menu2';
    var idnoncliccato_2 = 'menu3';
    } else {
    if(idcliccato=='menu2'){
    var idnoncliccato_1 = 'menu1';
    var idnoncliccato_2 = 'menu3';
    } else {
    var idnoncliccato_1 = 'menu1';
    var idnoncliccato_2 = 'menu2';
    }
    }

    var div1 = document.getElementById(idcliccato).style;
    var div2 = document.getElementById(idnoncliccato_1).style;
    var div3 = document.getElementById(idnoncliccato_2).style;

    div1.display = 'block';
    div2.display = 'none';
    div3.display = 'none';
    }
    -->
    </script>
    </head>
    <body>
    <input type="button" value="menu1" onClick="mostraMenu('menu1');">
    <input type="button" value="menu2" onClick="mostraMenu('menu2');">
    <input type="button" value="menu3" onClick="mostraMenu('menu3');">
    <div id="menu1" style="display:none; width:200px;
    background-color:yellow;">
    <span>Questo è il primo menu</span>
    </div>
    <div id="menu2" style="display:none; width:200px; background-color:red;">
    <span>Questo è il secondo menu</span>
    </div>
    <div id="menu3" style="display:none; width:200px;
    background-color:green;">
    <span>Questo è il terzo menu</span>
    </div>
    </body>
    </html>

  2. #2
    Moderatore di Annunci siti web, Offro lavoro/collaborazione, Cerco lavoro L'avatar di cavicchiandrea
    Registrato dal
    Aug 2001
    Messaggi
    26,133
    codice:
    <html>
    <head>
    <script type="text/javascript" language="Javascript">
    <!--
    function mostraMenu(idcliccato) {
    for(var i=1; i<=3;i++){
    if(i==idcliccato){
    document.getElementById('menu'+i).style.display = 'block';
    }else{
    document.getElementById('menu'+i).style.display = 'none';
    }
    }
    }
    -->
    </script>
    </head>
    <body>
    <input type="button" value="menu1" onClick="mostraMenu(1);">
    <input type="button" value="menu2" onClick="mostraMenu(2);">
    <input type="button" value="menu3" onClick="mostraMenu(3);">
    <div id="menu1" style="display:none; width:200px;
    background-color:yellow;">
    <span>Questo è il primo menu</span>
    </div>
    <div id="menu2" style="display:none; width:200px; background-color:red;">
    <span>Questo è il secondo menu</span>
    </div>
    <div id="menu3" style="display:none; width:200px;
    background-color:green;">
    <span>Questo è il terzo menu</span>
    </div>
    </body>
    </html>
    Cavicchi Andrea
    Problemi con javascript, jquery, ajax clicca qui

  3. #3
    Utente di HTML.it
    Registrato dal
    Feb 2013
    Messaggi
    11
    Ma non è uguale a prima?

  4. #4
    Moderatore di Annunci siti web, Offro lavoro/collaborazione, Cerco lavoro L'avatar di cavicchiandrea
    Registrato dal
    Aug 2001
    Messaggi
    26,133
    Pensavo che non fosse fondamentale, e preferisco "ottimizzare" il codice, se non è quello che volevi non considerare la mia risposta e attendi altri suggerimenti
    Cavicchi Andrea
    Problemi con javascript, jquery, ajax clicca qui

  5. #5
    Utente di HTML.it
    Registrato dal
    Feb 2013
    Messaggi
    11
    Si il codice è per me la strada giusta, volevo chiedere se si riesce a fare con 6 pulsanti nello stesso identico modo, ho provato a scrivere le variabili, ma non ci salto fuori....
    Riesci ad aiutarmi?

    Grazie

  6. #6
    Moderatore di Annunci siti web, Offro lavoro/collaborazione, Cerco lavoro L'avatar di cavicchiandrea
    Registrato dal
    Aug 2001
    Messaggi
    26,133
    Se intendi le modifiche al codice che ho scritto (al quale ho apportato qualche miglioria) sono semplici aggiungi gli altri tre menu4/5/6 e porti a 6 il ciclo for(var i=1; i<=6;i++){ se intendi "sistemare" il "tuo" codice no non ne vedo il motivo il mio codice funziona ed è più semplice e sintetico
    Cavicchi Andrea
    Problemi con javascript, jquery, ajax clicca qui

  7. #7
    Utente di HTML.it
    Registrato dal
    Feb 2013
    Messaggi
    11
    Grazie mille!!!
    Si è vero è ottimizzato!!!! Sono io che sono stato distratto, scusami !!!
    E molto più semplice cosi!!!

    Un ultima cosa, adesso lo sto modificando graficamente....
    In input al posto di input "button" posso caricarci un immagine, o due immagine create da me per il rollover?

    Poi ho inserito tutto il codice annidato all'interno di una altro div contenitore, ovvio che posso attraverso div id, modificare e spaziare il testo a mio piacimento.... giusto?

    P.S. Ah si può dare al testo del primo pulsante quando carichi la pagina, che sia già visibile?

    Scusa tutte queste domande e che sono esaltato sono alle mie prime righe di codice java e mi piace molto!!!

    Ciao e grazie!!

  8. #8
    Moderatore di Annunci siti web, Offro lavoro/collaborazione, Cerco lavoro L'avatar di cavicchiandrea
    Registrato dal
    Aug 2001
    Messaggi
    26,133
    Originariamente inviato da Zippu
    Grazie mille!!!
    Si è vero è ottimizzato!!!! Sono io che sono stato distratto, scusami !!!
    E molto più semplice cosi!!!

    Un ultima cosa, adesso lo sto modificando graficamente....
    In input al posto di input "button" posso caricarci un immagine, o due immagine create da me per il rollover?
    Si, se inserisci onclick direttamente nella immagine oppure aggiungi un href (<immagine/>)
    Poi ho inserito tutto il codice annidato all'interno di una altro div contenitore, ovvio che posso attraverso div id, modificare e spaziare il testo a mio piacimento.... giusto?
    E' ininfluente dati che ti riferisci ad egli id specifici
    P.S. Ah si può dare al testo del primo pulsante quando carichi la pagina, che sia già visibile?
    Si, basta che togli il display:none dal div
    Scusa tutte queste domande e che sono esaltato sono alle mie prime righe di codice java e mi piace molto!!!

    Ciao e grazie!!
    L'euforia è importante ma io mi leggerei anche un libro non affidarti solo al forum
    Cavicchi Andrea
    Problemi con javascript, jquery, ajax clicca qui

  9. #9
    Utente di HTML.it
    Registrato dal
    Feb 2013
    Messaggi
    11
    Hai ragione!!! Ho comprato un paio di libri, e ci do una occhiata per andare avanti pian piano!!
    Solo che sò che un modo per imparare è provare provare provare, almeno per me.....
    E logico che se uno non ha le basi, non è che può arrivare chissà dove....
    Appena faccio ho un po' di tempo leggo.... (hai qualche consiglio per un libro sul javascript non molto peso, ma chiaro?)

    Comunque grazie!!! Sono riuscito a fare tutto, tranne inserire le immagini rollover....

    Ti spiego....

    Ho inserito questa funzione in un div in image ho messo lo sfondo che cercavo

    <script type="text/javascript" language="Javascript">
    <!--
    function mostraMenu(idcliccato) {
    for(var i=1; i<=6;i++){
    if(i==idcliccato){
    document.getElementById('menu'+i).style.display = 'block';
    }else{
    var div2 = document.getElementById('menu'+i).style.display = 'none';
    var div3 = document.getElementById('menu'+i).style.display = 'none';
    }
    }
    }
    -->
    </script>
    <body>
    <input type="image" onClick="mostraMenu(1);" value="button1" src="img/1 />
    <input type="image" onClick="mostraMenu(2);" value="button2" src="img/2" />
    <input type="image" onClick="mostraMenu(3);" value="button3" src="img/3" />
    <input type="image" onClick="mostraMenu(4);" value="button4" src="img/4" />
    <input type="image" onClick="mostraMenu(5);" value="button5" src="img/5" />
    <input type="image" onClick="mostraMenu(6);" value="button6" src="img/6" />
    </div>

    Il resto dei div li ho messi in un altro div appena sotto (perché ho molto testo e quando partiva lo scroll anche il menu scompariva)

    <div id="menu1" style="display:none; width:200px;
    background-color:yellow;">
    <span>Questo è il primo menu</span>
    </div>
    <div id="menu2" style="display:none; width:200px; background-color:red;">
    <span>Questo è il secondo menu</span>
    </div>
    <div id="menu3" style="display:none; width:200px;
    background-color:green;">
    <span>Questo è il terzo menu</span>
    </div>

    Si, se inserisci onclick direttamente nella immagine oppure aggiungi un href (<immagine/> )
    Non ho capito questo.... ciao

  10. #10
    Moderatore di Annunci siti web, Offro lavoro/collaborazione, Cerco lavoro L'avatar di cavicchiandrea
    Registrato dal
    Aug 2001
    Messaggi
    26,133
    Spero che tu non te la prenda, ma non ho tempo (e anche poca voglia) di farti da tutor, leggi i libri che hai comprato e molti dubbi svaniranno
    Cavicchi Andrea
    Problemi con javascript, jquery, ajax clicca qui

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.