Navigazione

    Privacy - Termini e condizioni
    © 2020 Search On Media Group S.r.l.
    • Registrati
    • Accedi
    • CATEGORIES
    • Discussioni
    • Non letti
    • Recenti
    • Hashtags
    • Popolare
    • Utenti
    • Stream
    • Interest
    • Categories
    1. Home
    2. Categorie
    3. Coding e Sistemistica
    4. Coding
    5. Finestra a comparsa laterale senza ul e li
    Questa discussione è stata cancellata. Solo gli utenti con diritti di gestione possono vederla.
    • A
      another User Attivo • ultima modifica di

      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?

      0 Miglior Risposta Ringrazia Cita Rispondi

        1 Risposta Ultima Risposta
      • marcocarrieri
        marcocarrieri ModSenior • ultima modifica di

        Potresti adattare questo esempio alle tue esigenze.
        javascript.html.it/demo/javascript/575/esempio.htm

        0 Miglior Risposta Ringrazia Cita Rispondi

          1 Risposta Ultima Risposta
        • A
          another User Attivo • ultima modifica di

          purtroppo con ie 8 non funziona come dovrebbe...

          0 Miglior Risposta Ringrazia Cita Rispondi

            1 Risposta Ultima Risposta
          • marcocarrieri
            marcocarrieri ModSenior • ultima modifica di

            Mananggia a IE.. 😄 naturalmente indovina con browser l'ho guardato?
            Firefox eh eh. 😄

            0 Miglior Risposta Ringrazia Cita Rispondi

              1 Risposta Ultima Risposta
            • A
              another User Attivo • ultima modifica di

              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?

              0 Miglior Risposta Ringrazia Cita Rispondi

                1 Risposta Ultima Risposta
              • marcocarrieri
                marcocarrieri ModSenior • ultima modifica di

                Con un display:none forse risolvi.

                0 Miglior Risposta Ringrazia Cita Rispondi

                  1 Risposta Ultima Risposta
                • A
                  another User Attivo • ultima modifica di

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

                  0 Miglior Risposta Ringrazia Cita Rispondi

                    1 Risposta Ultima Risposta
                  • K
                    karedas Super User • ultima modifica di

                    Ciao another,
                    prova in questo modo:

                    
                    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.

                    0 Miglior Risposta Ringrazia Cita Rispondi

                      1 Risposta Ultima Risposta
                    • A
                      another User Attivo • ultima modifica di

                      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?

                      0 Miglior Risposta Ringrazia Cita Rispondi

                        1 Risposta Ultima Risposta
                      • A
                        another User Attivo • ultima modifica di

                        ho risolto (credo...) sostituendo

                        left: 400px;

                        con

                        left: auto;

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

                        0 Miglior Risposta Ringrazia Cita Rispondi

                          1 Risposta Ultima Risposta
                        Caricamento altri post
                        Rispondi
                        • Topic risposta
                        Effettua l'accesso per rispondere
                        • Da Vecchi a Nuovi
                        • Da Nuovi a Vecchi
                        • Più Voti