【问题标题】:Getting an image's 'real' width and height in IE在 IE 中获取图像的“真实”宽度和高度
【发布时间】:2012-02-25 04:43:51
【问题描述】:

我目前正在构建一个站点并使用 Shadowbox JS 插件来显示图像。

因为我们通过 JSP 提供图像(而不是直接链接到图像文件),Shadowbox 似乎无法动态确定它们的宽度和高度,因此只能以屏幕大小的叠加层打开图像。

可以使用 'rel' 手动将宽度和高度传递给 shadowbox 插件,因此我使用以下代码解决了 FF/Chrome/Safari 的问题:

$('#pic1img').attr("src")).load(function() {
            picWidth    = this.width;
            picHeight   = this.height;
    });

 $(window).load(
            function() {
                var w = $("#pic1img").width();
                var h = $("#pic1img").height();
                if( picWidth < w ){ picWidth = w; }
                if( picHeight < h ){ picHeight = h; }
                $('#pic1').attr('rel', 'shadowbox[pics];height=' + picHeight + ';width=' + picWidth);
            }
 );

但我在 IE 中找不到任何方法。

【问题讨论】:

  • 在 IE 中具体发生了什么?您在寻找 naturalWidth 和 naturalHeight 属性吗?

标签: javascript html image internet-explorer shadowbox


【解决方案1】:

一旦我开始以全尺寸加载缩略图,然后在加载后设置它们的宽度和高度,代码实际上就可以工作了。

问题是我将周围的 div 设置为

display: none 

直到图像被加载并且 IE 无法计算出隐藏图像的大小。

通过设置解决了这个问题

visibility: hidden

改为。

【讨论】:

猜你喜欢
  • 2010-09-24
  • 1970-01-01
  • 1970-01-01
  • 2010-11-18
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2010-10-01
相关资源
最近更新 更多