Visualizzazione risultati 1 fino 6 di 6

Discussione: Devo effettuare due click per l'apertura del div :(

  1. #1
    Guest

    Predefinito Devo effettuare due click per l'apertura del div :(

    Salve, ho uno script che è composto da due div a scomparsa. Il problema è che quando carico la pagina (solo quando la carico) devo fare doppio click sul link per far aprire il div! Poi tutto il resto è ok...
    Vi posto il codice!

    Codice HTML:
    <html>
    <head>
    <script type="text/javascript">
    	function message() {
    	if (document.getElementById('messagebox-top').style.display == 'none') {
    		if (document.getElementById('notifybox').style.display == 'block') {
    				document.getElementById('notifybox').style.display = 'none';
    				document.getElementById('messagebox-top').style.display = 'block';
    		} 
    		else if (document.getElementById('notifybox').style.display == 'none') {
    				document.getElementById('messagebox-top').style.display = 'block';
    		}
    	}
    	else {
    		document.getElementById('messagebox-top').style.display = 'none';
    		document.getElementById('notifybox').style.display = 'none';
    	}
    	}
    	
    	function notify() {
    	if (document.getElementById('notifybox').style.display == 'none') {
    		if (document.getElementById('messagebox-top').style.display == 'block') {
    				document.getElementById('messagebox-top').style.display = 'none';
    				document.getElementById('notifybox').style.display = 'block';
    		} 
    		else if (document.getElementById('messagebox-top').style.display == 'none') {
    				document.getElementById('notifybox').style.display = 'block';
    		}
    	}
    	else {
    		document.getElementById('notifybox').style.display = 'none';
    		document.getElementById('messagebox-top').style.display = 'none';
    	}
    	}
    </script> 
    <style>
    .messagebox-top { display: none; }
    .notifybox { display: none; }
    </style>
    </head>
    <body>
    <table>
    <td onclick="message();">Apri DIV 1</td>
    <td onclick="notify();">Apri DIV 2</td>
    </table>
    
    <div id="messagebox-top">
    Content 
    </div>
    <div id="notifybox">
    Content 2
    </div>
    Grazie in anticipo

  2. #2
    Guest

    Predefinito

    Citazione Originalmente inviato da colore123 Visualizza messaggio
    Salve, ho uno script che è composto da due div a scomparsa. Il problema è che quando carico la pagina (solo quando la carico) devo fare doppio click sul link per far aprire il div! Poi tutto il resto è ok...
    Vi posto il codice!

    Codice HTML:
    <html>
    <head>
    <script type="text/javascript">
    	function message() {
    	if (document.getElementById('messagebox-top').style.display == 'none') {
    		if (document.getElementById('notifybox').style.display == 'block') {
    				document.getElementById('notifybox').style.display = 'none';
    				document.getElementById('messagebox-top').style.display = 'block';
    		} 
    		else if (document.getElementById('notifybox').style.display == 'none') {
    				document.getElementById('messagebox-top').style.display = 'block';
    		}
    	}
    	else {
    		document.getElementById('messagebox-top').style.display = 'none';
    		document.getElementById('notifybox').style.display = 'none';
    	}
    	}
    	
    	function notify() {
    	if (document.getElementById('notifybox').style.display == 'none') {
    		if (document.getElementById('messagebox-top').style.display == 'block') {
    				document.getElementById('messagebox-top').style.display = 'none';
    				document.getElementById('notifybox').style.display = 'block';
    		} 
    		else if (document.getElementById('messagebox-top').style.display == 'none') {
    				document.getElementById('notifybox').style.display = 'block';
    		}
    	}
    	else {
    		document.getElementById('notifybox').style.display = 'none';
    		document.getElementById('messagebox-top').style.display = 'none';
    	}
    	}
    </script> 
    <style>
    .messagebox-top { display: none; }
    .notifybox { display: none; }
    </style>
    </head>
    <body>
    <table>
    <td onclick="message();">Apri DIV 1</td>
    <td onclick="notify();">Apri DIV 2</td>
    </table>
    
    <div id="messagebox-top">
    Content 
    </div>
    <div id="notifybox">
    Content 2
    </div>
    Grazie in anticipo
    A parte che hai usato una marea di codice, il comportamento è corretto, poiché all'apertura della pagina i due DIV sono visibili e quindi al primo click vengono nascosti ed al secondo inizia a funzionare il tuo script ...

    Il problema è che nel definire gli stili hai definito lo stile per delle classi (.messagebox-top, .notifybox, mentre avresti dovuto usare gli identificato per gli ID #messagebox-top, #notifybox) e poi usato degli id.
    Ultima modifica di simpleticket : 10-07-2012 alle ore 17.25.32

  3. #3
    Guest

    Predefinito

    No scusa ho sbagliato io! I div hanno una classe che setta il display su none e un id (notifybox e messagebox-top) ma al caricamento della pagina non sono visibili proprio perche hanno il display su none
    Come posso fare?

  4. #4
    Guest

    Predefinito

    Nessuno ?!?!??

  5. #5
    Guest

    Predefinito

    Prova così

    Codice PHP:
    <html>
    <
    head>
    <
    script type="text/javascript">
    function
    message() {
    if (
    document.getElementById('messagebox-top').style.display == 'none') {
    if (
    document.getElementById('notifybox').style.display == 'block') {
    document.getElementById('notifybox').style.display = 'none';
    document.getElementById('messagebox-top').style.display = 'block';
    }
    else if (
    document.getElementById('notifybox').style.display == 'none') {
    document.getElementById('messagebox-top').style.display = 'block';
    }
    }
    else {
    document.getElementById('messagebox-top').style.display = 'none';
    document.getElementById('notifybox').style.display = 'none';
    }
    }

    function
    notify() {
    if (
    document.getElementById('notifybox').style.display == 'none') {
    if (
    document.getElementById('messagebox-top').style.display == 'block') {
    document.getElementById('messagebox-top').style.display = 'none';
    document.getElementById('notifybox').style.display = 'block';
    }
    else if (
    document.getElementById('messagebox-top').style.display == 'none') {
    document.getElementById('notifybox').style.display = 'block';
    }
    }
    else {
    document.getElementById('notifybox').style.display = 'none';
    document.getElementById('messagebox-top').style.display = 'none';
    }
    }

    function
    init() {
    document.getElementById('messagebox-top').style.display = 'none';
    document.getElementById('notifybox').style.display = 'none';
    }

    </script>

    </head>
    <body onload="init()">
    <table>
    <td onclick="message();">Apri DIV 1</td>
    <td onclick="notify();">Apri DIV 2</td>
    </table>

    <div id="messagebox-top">
    Content
    </div>
    <div id="notifybox">
    Content 2
    </div>

    </body>
    </html>
    In sostanza non setti lo stile (così eviti anche che chi ha JS diabilitato non veda nulla) e lanci al caricamento della pagina una funzione che provvede a nascondere i due div (init).

    ;)

  6. #6
    Guest

    Predefinito

    Sii grazie mille ha funzionato! :)

Regole di scrittura

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