#画像拡大(ブロック固定なし)
##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>