Эффектное увеличение изображений с использованием CSS3
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 |
#container { width: 300px; margin: 0 auto; } #ex2 img{ height: 100px; width: 300px; margin: 15px 0; -webkit-transition: all 1s ease; -moz-transition: all 1s ease; -o-transition: all 1s ease; } #ex2 img:hover { height: 133px; width: 400px; margin-left: -50px; } |
2#: Картинки оформляем следующим образом:
1 2 3 4 5 6 7 8 |
<div id="containerEx2"> <div id="ex2"> <img src="/images/ex2.jpg"><br/> <img src="/images/ex2.jpg"><br/> <img src="/images/ex2.jpg"><br/> <img src="/images/ex2.jpg"> </div> </div> |