CSS transformscaleのhoverで画像拡大

画像拡大（ブロック固定なし）

CSS

<style type="text/css" media="screen">
.scale img {
transition: all 0.2s linear; //開く速さ
}
.scale img:hover {
-webkit-transform: scale(2.4);
-moz-transform: scale(2.4);
-o-transform: scale(2.4);
-ms-transform: scale(2.4);
transform: scale(2.4); //拡大倍率
z-index: 9999;
}   
</style>

HTML

<div  class="scale" >
 <img src="画像パス">
</div>

画像拡大（ブロック固定）

CSS

<style type="text/css" media="screen">
.scale{
width:200px;
height:150px;
border:1px solid #ccc;
overflow:hidden;
}
.scale img {
transition: all 0.2s linear; //開く速さ
}
.scale img:hover {
-webkit-transform: scale(2.4);
-moz-transform: scale(2.4);
-o-transform: scale(2.4);
-ms-transform: scale(2.4);
transform: scale(2.4); //拡大倍率
z-index: 9999;
}   
</style>

HTML

<div  class="scale" >
 <img src="画像パス">
</div>