Question

我正在将背景图片加载到div中。是否可以从此图像中获取尺寸？

我正在尝试制作一个能够动态替换文本的功能，以便在菜单中使用。

$.fn.MenuImages = function() {
  return this.each(function(i) {
    var name = $(this).find('a').attr('title');
    $(this).css("background-image","url(images/menu-"+name+"-h.png)");
  });
};

问题是图像并非都具有相同的尺寸。我不知道如何读取文件的尺寸，除非我将它加载到隐藏的div或其他东西，但听起来很脏。有什么建议？谢谢！

修正：

$.fn.MenuImages = function() {
return this.each(function(i) {
    var link = $(this).find('a');
    var name = link.attr('title');
    link.html("<img src='images/menu-"+name+"-h.png' />");
});

};

Answer 1

$('<img src='images/menu-"+name+"-h.png' />').attr('src',function(){
    return $('body').css('background-image');
}).load(function(){
    w = $(this).width();
    h = $(this).height();
});

等待图像加载以获取高度和宽度。

Answer 2

var img=new Image();
img.onload=function(){
    alert(img.width);
    alert(img.height);
};
img.src="image.png";

Answer 3

Jquery的

w = $("img").width();
h = $("img").height();

红宝石

IO.read('image.png')[0x10..0x18].unpack('NN')

这会产生一个数组[width，height]，您可以为宽度等提取[0] ......

使用jQuery从background-image获取维度

3 个答案: