Pagina 1 di 2 1 2 ultimoultimo
Visualizzazione dei risultati da 1 a 10 su 17
  1. #1
    Utente di HTML.it
    Registrato dal
    Dec 2010
    Messaggi
    7

    far apparire testo su pagina html senza ricaricarla

    Salve,
    una domanda che per molti di voi sarà facilissimo rispondere.
    Devo semplicemente fare in modo che cliccando su un testo tipo "controlla orari e programma" ti si apre sulla stessa pagina immediatamente sotto delle info e una tabellina senza ricaricare la pagina.
    Come fareste?

  2. #2
    Moderatore di JavaScript L'avatar di br1
    Registrato dal
    Jul 1999
    Messaggi
    19,998
    Se le informazioni richieste sono gia' stabilite quando la pagina e' stata richiesta e' sufficiente un div contenente le informazioni da far apparire al momento
    (esempio didattico)
    codice:
    <div id="MyInfo" style="display:none;">Qui le informazioni</div>
    Mostra Info
    Altrimenti c'e' AJAX
    Il guaio per i poveri computers e' che sono gli uomini a comandarli.

    Attenzione ai titoli delle discussioni: (ri)leggete il regolamento
    Consultate la discussione in rilievo: script / discussioni utili
    Usate la funzione di Ricerca del Forum

  3. #3
    Utente di HTML.it
    Registrato dal
    Dec 2010
    Messaggi
    7
    Grazie!!!Era quello che cercavo!!!

  4. #4
    Utente di HTML.it
    Registrato dal
    Dec 2010
    Messaggi
    7
    Ciao,
    se volessi fare che cliccando sull'a il div appare o scompare alternativamente come potrei fare?

  5. #5
    Moderatore di Annunci siti web, Offro lavoro/collaborazione, Cerco lavoro L'avatar di cavicchiandrea
    Registrato dal
    Aug 2001
    Messaggi
    26,133
    codice:
    <div id="MyInfo" style="display: none;">Qui le informazioni</div>
    <a href="#" title="Mostra Info"
    onclick="document.getElementById('MyInfo').style.display = (document.getElementById('MyInfo').style.display=='none')?'block':'none';document.getElementById('MyInfo').style.display = (document.getElementById('MyInfo').style.display=='none')?this.innerHTML='Mostra info':this.innerHTML='Chiusi info';return false">Mostra
    Info</a>
    Cosi fa quanto desideri, ho aggiunto la modifica del testo "Mostra info/Chiudi info" se non ti serve togli la seconda parte di codice.
    Cavicchi Andrea
    Problemi con javascript, jquery, ajax clicca qui

  6. #6
    Utente di HTML.it
    Registrato dal
    Dec 2007
    Messaggi
    18
    Grazie Cavicchiandrea! è stato molto utile anche a me!
    Ma sono arrivato a questa pagina perchè in realtà cercavo altro.
    Vorrei far apparire la scritta "modifica" se si col mouse si è dentro al DIV contenente delle info.
    L'esempio tipico e quando si va sulle DIV di Facebook e compaiono scritte tipo "modifica" o "elimina".
    Tu sai come fare?
    Grazie in anticipo!

  7. #7
    Moderatore di Annunci siti web, Offro lavoro/collaborazione, Cerco lavoro L'avatar di cavicchiandrea
    Registrato dal
    Aug 2001
    Messaggi
    26,133
    abbozzato uno spunto, se ho capito cosa intendi (non frequento facebook):
    codice:
    <html>
    <head>
    <meta content="text/html; charset=ISO-8859-1"
    http-equiv="content-type">
    <title>test</title>
    <style type="text/css">
    #mes {
    border-style: outset inset inset outset;
    border-color: #cc6600;
    border-top: 1px outset #cc6600;
    border-right: 1px inset #cc6600;
    position: absolute;
    width: 150px;
    z-index: 50;
    height: 50px;
    margin-top: -14px;
    margin-left: 344px;
    display:none;
    }
    #contenitore {
    border: 1px solid #ffcc00;
    width: 500px;
    height: 500px;
    margin-right: 50%;
    margin-left: 50%;
    }
    
    </style>
    </head>
    <body>
    <div id="contenitore"
    onmouseover="document.getElementById('mes').style.display='block'"
    onmouseout="document.getElementById('mes').style.display='none'">qui
    va il testo principale
    <div id="mes">testo messaggio che dovrà apparire</div>
    </div>
    </body>
    </html>
    per modificare/implementare leggi qui.

    P.S. In futuro apri delle discussioni tue.
    Cavicchi Andrea
    Problemi con javascript, jquery, ajax clicca qui

  8. #8
    Utente di HTML.it
    Registrato dal
    Dec 2007
    Messaggi
    18
    Grazie Andrea!
    Perfetto è lui!
    A me serve che appaia in alto a destra, quindi mi sono permesso di levare position: absolute; e le sue relative coordinate, aggiungendo un float:right;
    Ma il tuo esempio così completo è perfetto!
    Grazie ancora!

    ps: grazie anche per il link. Lo conosco perchè javascript lo sto studiando, ma da veramente pochissimo.
    pps: hai ragione, la prossima volta apro discussioni mie...

    buona serata,
    Matteo

  9. #9
    Originariamente inviato da cavicchiandrea
    codice:
    <div id="MyInfo" style="display: none;">Qui le informazioni</div>
    <a href="#" title="Mostra Info"
    onclick="document.getElementById('MyInfo').style.display = (document.getElementById('MyInfo').style.display=='none')?'block':'none';document.getElementById('MyInfo').style.display = (document.getElementById('MyInfo').style.display=='none')?this.innerHTML='Mostra info':this.innerHTML='Chiusi info';return false">Mostra
    Info</a>
    Cosi fa quanto desideri, ho aggiunto la modifica del testo "Mostra info/Chiudi info" se non ti serve togli la seconda parte di codice.
    Salve a tutti.

    Mi ricollego a questo thread e nella fattispecie a questo post per un piccolo problema che vorrei risolvere: su Firefox inserendo il codice sovrastante ottengo l'effetto desiderato, con Explorer invece quando clicco sulla parola che dovrebbe espandere il testo, ciò accade ma con l'inconveniente che si viene automaticamente riportati a inizio pagina...
    Come posso risolvere questa situazione?
    Grazie in anticipo a chi mi vorrà rispondere!

    P.S. Questo il link alla pagina: http://assettosocietarioceltic.blogs...ne-200809.html (in fondo troverete una lista di giornate, dalla 18a alla 1a. Cliccando su "1^ giornata" si paleserà il problema esposto)

  10. #10
    Piccola aggiunta: oltre a quanto già detto, su IE mi dà il seguente messaggio nell'angolo in basso a sinistra: Errore nella visualizzazione della pagina. (Dettagli: Impossibile ottenere la proprietà display. Argomento non valido.)

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.