CSS와 SVG를 fisheye 애니메이션

제목은 그럴듯 하지만 CSS의 hover속성을 이용한 mouseover, click 이벤트에 따른 이미지로드이다.

원본출처 : http://www.sitepen.com/blog/2008/03/28/svg-css-animations-fisheye-fun/
데모 : http://sitepen.com/labs/code/cssDock/

.dock img {
   width:50px;
   padding:10px;
   float:left;
   position:relative;
   display:block;
   -webkit-transition:width 0.5s ease-out, top 0.2s ease-out;
}
 
.dock img:hover {
   width:100px;
}
 
.dock img:active {
   top:-40px;
}
 
.dock img:hover + img {
   width:70px;
}