Link a overlay

Kovacs · 20 Mag 2015

Buongiorno a tutti!

se non sbaglio è il mio primo post, saluto tutti e chiedo subito venia per la mia ignoranza abissale.

ho un problema con un sito di un portfolio, visibile qui: www.gretabighi.com

nella sezione portfolio ci sono le "copertine" dei singoli progetti, al mouseover le copertine vengono coperte da un overlay e compaiono nome progetto e icona con link alla pagina del progetto. la mia intenzione è di linkare tutto l'overlay perché il link solo sull'iconcina non è molto intuitivo.

qualcuno mi può aiutare? grazie per il supporto!!

WottaFacca · 21 Mag 2015

HTML:

<li class="cbp-item effect effects grafica editoria">
                                <div class="img">
                                   
                                   <img src="img/adopnation/adopnation-cover.jpg" class="img-responsive" alt=""  />
                                    <div class="overlay">
                                    
                                        <ul class="expand">
                                            <li class="cbp-l-caption-title">AdopNation</li>
                                            <li class="cbp-l-caption-desc"></li>
                                            <li class="cbp-l-icon"><a href="projects/adopnation.html" class="cbp-singlePage"><i class="icon-eye"></i></a></li>
                                        </ul>
                                    </div>
                                </div>
                            </li>

Questo è il codice della prima immagine, prova sostituendolo con questo

HTML:

<a href="projects/adopnation.html" class="cbp-singlePage">
<li class="cbp-item effect effects grafica editoria">
                                <div class="img">
                                   
                                   <img src="img/adopnation/adopnation-cover.jpg" class="img-responsive" alt=""  />
                                    <div class="overlay">
                                    
                                        <ul class="expand">
                                            <li class="cbp-l-caption-title">AdopNation</li>
                                            <li class="cbp-l-caption-desc"></li>
                                            <li class="cbp-l-icon"><i class="icon-eye"></i></li>
                                        </ul>
                                    </div>
                                </div>
                            </li> 
							</a>

Però potrebbero esserci dei problemi nei css, quindi poi ci sarà da sistemare quelli

Kovacs · 21 Mag 2015

Ciao e grazie del suggerimento!

ho provato a sostituire il codice ma ho notato 2 cose:
1) se tolgo il link dall'icona scompare tutta la copertina, con le altre copertine che scalano di posizione a coprire il buco.
2) se aggiungo il link in cima (lasciandolo anche nell'icona se no scompare la copertina) si linka anche il titolo del progetto ma non l'overlay.

Link a overlay

Kovacs

Nuovo Utente

WottaFacca

Utente Attivo

Kovacs

Nuovo Utente

Discussioni simili

Link a overlay

Kovacs

Nuovo Utente

WottaFacca

Utente Attivo

Kovacs

Nuovo Utente

Discussioni simili

Privacy & Transparency

Privacy & Transparency