In primul rand,introduceti acest cod in foaia de stil CSS a paginii:

Code:

.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:

Code:

<ul class="bubblewrap">

Apoi,pentru fiecare imagine vom folosi codul acesta:

Code:

<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 [You must be registered and logged in to see this link.] ,dumneavoastra inlocuiti cu linkul imaginii dorite.Folositi codul de mai sus pana terminati cu imaginile,apoi incheiati codul cu:

Code:

</ul>

DEMO: [You must be registered and logged in to see this link.]

Super tare Imi place Bravo

Mai stiu eu o metoda, dar e mai complicata.. Asa ca.. buna treaba!