使用 css 缩放图像时如何获取当前图像大小?
我正在尝试获取瞬时图像大小,调整窗口大小,从而改变图像大小。
我想这是某种jQuery
.height()
.width()
JSFIDDLE
CSS
#full_image{
margin:0;
padding:0;
list-style:none;
white-space: nowrap;
overflow:hidden;
position:relative;
display:inline-block;
}
#full_image ul li img{
margin:0 auto;
width:100%;
max-width:100%
}
#full_image .full_close{
background-color: red;
top: 10px;
cursor: pointer;
height: 29px;
opacity: 1;
position: absolute;
width: 29px;
z-index: 999;
right: 10px;
}
#full_image .next_big{
background-color: red;
top: 50%;
cursor: pointer;
height: 29px;
opacity: 1;
position: absolute;
width: 29px;
z-index: 999;
right: 0px;
}
#full_image .prev_big{
background-color: red;
top: 50%;
cursor: pointer;
height: 29px;
opacity: 1;
position: absolute;
width: 29px;
z-index: 999;
left: 0px;
color: #222;
}
的HTML
<div id="full_image">
<ul><li><a href="#"> <img src="http://i.telegraph.co.uk/multimedia/archive/01636/saint-tropez-beach_1636818c.jpg" alt="" /></a></li> </ul>
<a href="#" class="full_close"></a>
<a href="#" class="button next_big"></a>
<a href="#" class="button prev_big"></a>
</div>