Ultimele subiecte
» Metin2NA - NewAge [ PvM Easy 2015 ] ! Scris de Linuxel Joi Feb 19, 2015 2:13 am
» • Metin2DR - International Private Servers Hard PvM Old School
Scris de Linuxel Sam Ian 31, 2015 10:31 am
» Despre Noi
Scris de Hacked by Capone Mar Feb 28, 2012 9:31 am
» Colta Zone
Scris de Hacked by Capone Dum Feb 19, 2012 12:36 am
» Noua Tema
Scris de Hacked by Capone Vin Dec 23, 2011 2:39 am
Image zoom on mouseover
:: Pentru Membri :: Coduri & Scripturi :: CSS
Pagina 1 din 1
Image zoom on mouseover
In primul rand,introduceti acest cod in foaia de stil CSS a paginii:
Pentru a ne folosi de efectul acesta de zoom,ne vom folosi de ul si li.
Incepeti codul cu:
Apoi,pentru fiecare imagine vom folosi codul acesta:
Desigur,in codul de mai sus eu am folosit o imagine de pe iconarchive.com ,dumneavoastra inlocuiti cu linkul imaginii dorite.Folositi codul de mai sus pana terminati cu imaginile,apoi incheiati codul cu:
- Cod:
.bubblewrap{
list-style-type:none;
margin:0;
padding:0;
}
.bubblewrap li{
display:inline;
width: 65px;
height:60px;
}
.bubblewrap li img{
width: 55px;
height: 60px;
border:0;
margin-right: 12px;
-webkit-transition:-webkit-transform 0.1s ease-in;
-o-transition:-o-transform 0.1s ease-in;
}
.bubblewrap li img:hover{
-moz-transform:scale(1.8);
-webkit-transform:scale(1.8);
-o-transform:scale(1.8);
}
Pentru a ne folosi de efectul acesta de zoom,ne vom folosi de ul si li.
Incepeti codul cu:
- Cod:
<ul class="bubblewrap">
Apoi,pentru fiecare imagine vom folosi codul acesta:
- Cod:
<li><a href="http://facebook.com/"><img src="http://icons.iconarchive.com/icons/land-of-web/globe-social/128/facebook-icon.png" title="Facebook" /></a></li>
Desigur,in codul de mai sus eu am folosit o imagine de pe iconarchive.com ,dumneavoastra inlocuiti cu linkul imaginii dorite.Folositi codul de mai sus pana terminati cu imaginile,apoi incheiati codul cu:
- Cod:
</ul>
:: Pentru Membri :: Coduri & Scripturi :: CSS
Pagina 1 din 1
Permisiunile acestui forum:
Nu puteti raspunde la subiectele acestui forum
|
|