jquery - 居中图片

Question

我想在隐藏了溢出的 div 中将图像居中

就像一个框架，然后无论大小的图片都居中。

<div class="holder">
   <div id="frame">
      <img src="http://www.travelblog.org/Wallpaper/pix/tb_fiji_sunset_wallpaper.jpg" class="centerme"/>
   </div>
</div>​

查看图片了解更多信息:

标准状态是溢出时的状态:隐藏；

但需要它始终居中，即使是比框架大 3 倍的图片

*这里是 JSfiddle http://jsfiddle.net/UL3qp/4/

*编辑
最后需要的是循环这个事件

Answer 1

使图像居中 with jQuery is simple - 通过设置正或负的 margin-left 属性:

$(document).ready(function(){
    var fwidth = $('#frame').width();
    var iwidth = $('#frame img').width();
    $('#frame img').css('margin-left', Math.floor((fwidth-iwidth)/2));
});

仅使用纯 CSS 就可以通过 a background image css property 完成而不是使用 img 标签。