Visualizzazione dei risultati da 1 a 2 su 2
  1. #1

    Problema con effetto hover CSS

    Ciao a tutti,
    ho un problema con l'effetto Hover su immagine.
    Non riesco a capire come mai quando passo il mouse sopra l'immagine di sfondo, questa diventi completamente bianca e non trasparente.
    Vi riporto il css:
    codice:
    /*hover CTA */
    
    
     .container {
         position: relative;
         width: 100%;
    }
    
     .image {
         display: block;
         opacity:1;
    }
    
     .overlay {
         position: absolute;
         top: 0;
         bottom: 0;
         left: 0;
         right: 0;
         opacity: 0;
         transition: .3s ease;
         background-color:#fff;
    }
    
     .container:hover .overlay {
         opacity: 1;
    }
    
     .text {
         position: absolute;
         top: 50%;
         left: 50%;
         transform: translate(-50%, -50%);
         -ms-transform: translate(-50%, -50%);
         text-align: center;
    }
    
    /*hover CTA end*/
    e l'html:
    codice HTML:
    <table width="300" align="center" border="0" cellpadding="0" cellspacing="0" class="mobile-cont">
       <tr>
          <td>
             <div class="container">
                <img src="img_kids.jpg" alt="Avatar" width="300" class="image">
                <div class="overlay">
                   <div class="text"> <img src="pappapero.jpg" width="150"></div>
                </div>
             </div>
          </td>
       </tr>
    </table>
    mi sa che mi sfugge qualcosa... riuscireste ad aiutarmi?

    Grazie mille,
    Mara
    Ultima modifica di KillerWorm; 22-02-2018 a 23:40 Motivo: aggiunti tag code

  2. #2
    Semplicemente diventa bianca perché diventando trasparente ti fa vedere lo sfondo di defoult del browser che è bianco!
    Se ti aspetti di vedere lo sfondo del desktop, non ti avverrà mai
    “Che le cose siano cosi, non vuol dire che debbano andare così. Solo che quando si tratta di rimboccarsi le maniche e incominciare a cambiare, vi è un prezzo da pagare. Ed è allora che la stragrande maggioranza preferisce lamentarsi più che fare”.

    Giovanni Falcone

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 © 2024 vBulletin Solutions, Inc. All rights reserved.