+ Rispondi alla Discussione
Risultati da 1 a 10 di 10

Finestra a comparsa laterale senza ul e li

Ultimo Messaggio di another il:
  1. #1
    User
    Data Registrazione
    Dec 2005
    Messaggi
    138

    Finestra a comparsa laterale senza ul e li

    Ciao,
    avrei la necessità di far apparire a comparsa con a:hover una finestra laterale, tipo width:500px con un'img in background, senza usare ul e li.
    è possibile?

  2. #2
    ModSenior L'avatar di marcocarrieri
    Data Registrazione
    Jul 2009
    Località
    Rovigo
    Messaggi
    24,366
    Potresti adattare questo esempio alle tue esigenze.
    javascript.html.it/demo/javascript/575/esempio.htm

  3. #3
    User
    Data Registrazione
    Dec 2005
    Messaggi
    138

    mm

    purtroppo con ie 8 non funziona come dovrebbe...

  4. #4
    ModSenior L'avatar di marcocarrieri
    Data Registrazione
    Jul 2009
    Località
    Rovigo
    Messaggi
    24,366
    Mananggia a IE.. naturalmente indovina con browser l'ho guardato?
    Firefox eh eh.

  5. #5
    User
    Data Registrazione
    Dec 2005
    Messaggi
    138

    però

    con questo codice:

    div#main a {
    position: relative;
    display:hidden;
    }
    div#main a:hover span {
    display: block;
    position: absolute;
    top: 500; left: 400px;
    width: 500px;
    padding: 5px;
    border-style: solid;
    border-color: white;
    border-width: 5px;
    color: white;
    background: #720E0E;
    text-align: center;
    font: bold 12pt Arial;
    z-index: 2;
    }

    <p><a href="#">questo è il link <span>questo il contenuto</span></a><p>

    è quasi quello che vorrei, perchè:

    il contenuto che dovrebbe comparire solo ad a:hover è sempre presente.

    come posso renderlo nascosto, non visibile, quando non si passa col mouse?

  6. #6
    ModSenior L'avatar di marcocarrieri
    Data Registrazione
    Jul 2009
    Località
    Rovigo
    Messaggi
    24,366
    Con un display:none forse risolvi.

  7. #7
    User
    Data Registrazione
    Dec 2005
    Messaggi
    138

    grrrr

    con none non si visualizza più nulla... nemmeno il link 'questo è il link' che si dovrebbe vedere...

  8. #8
    User Attivo L'avatar di karedas
    Data Registrazione
    May 2007
    Località
    Impruneta (Firenze)
    Messaggi
    1,102
    Ciao another,
    prova in questo modo:

    Codice:
    div#main a {
    position: relative;
    }
    div#main a span{display:none;}
    Il resto sull'evento hover puoi lasciarlo così come lo hai fatto

    Facci sapere.
    Easysystem- Software and hardware solutions

  9. #9
    User
    Data Registrazione
    Dec 2005
    Messaggi
    138

    quasi

    ciao,
    grazie e tutti, come sempre, per le risposte.
    per il momento avrei risolto in questo modo:

    div.box span{
    position: relative;
    display:none;
    }
    div.box a span{
    position: relative;
    display:none;
    }
    div.box a:hover span {
    display: block;
    position: absolute;
    top: 50px;
    left: 400px;
    width: 478px;
    padding: 5px;
    z-index: 2;
    color: #000000;
    text-decoration: none;
    }

    però il fatto di avere posizionato 'absolute' potrebbe creare problemi in base alle risoluzioni, o sbaglio?

  10. #10
    User
    Data Registrazione
    Dec 2005
    Messaggi
    138

    forse si?!!!

    ho risolto (credo...) sostituendo

    left: 400px;

    con

    left: auto;

    dico credo, perchè ho provato con questo simulatore:
    viewlikeDOTus

+ Rispondi alla Discussione

^ Permessi di Scrittura

  • Tu non puoi inviare nuove discussioni
  • Tu non puoi inviare risposte
  • Tu non puoi inviare allegati
  • Tu non puoi modificare i tuoi messaggi
  •  
  • Il codice BB è Attivato
  • Le faccine sono Attivato
  • Il codice [IMG] è Attivato
  • Il codice [VIDEO] è Attivato
  • Il codice HTML è Disattivato
  • Trackbacks Attivato
  • Pingback Attivato
  • Refback Attivato

SEO by vBSEO 3.6.0 PL2 ©2011, Crawlability, Inc.