Question

我有一些div框，里面有一个图像。我想要它做的是，如果图像高度小于其内部的div框高度，则为图像添加一个类。

但是我已经将图像设置为带有css的div框的100％宽度，所以当我在图像上使用jquery的.Height（）时，它会给我原始大小。有什么建议吗？

<div class="boxe">
    <asp:Literal ID="imgProjekt1" runat="server" />
    <asp:Literal ID="litProjekt1" runat="server"/>
</div>

<div class="boxe forsideboxMiddle">
    <asp:Literal ID="imgProjekt2" runat="server" />
    <asp:Literal ID="litProjekt2" runat="server"/>
</div>

带有ID imgProjekt1和ImgProjekt2的文字从代码隐藏中生成一个普通的img标记。

Answer 1

尝试

var currentContentHeight = contentElement.offsetHeight;

Answer 2

你应该使用clientWidth＆amp; clientHeight。

var img = document.getElementById('imgProjekt1'); 
var width = img.clientWidth;
var height = img.clientHeight;

编辑：

$(window).load(function () { 
    var image = $('.boxe img');
    var box = $(".boxe");
    if (image[0].clientHeight > box[0].clientHeight) { 
        image.addClass('billedMiddle');
    }
});

Answer 3

使用window.getComputedStyle获取当前DOM的对象样式值。下面是如何提取dom对象的高度和宽度的代码示例。

function Scale(width_offset, height_offset) {
   var imgs = document.getElementsByClassName("your img tag class name");
   for (var i = 0; i < imgs.length; i++) {
     var curr_width = parseInt(window.getComputedStyle(imgs[i]).width); // extract dom's width
     var curr_height = parseInt(window.getComputedStyle(imgs[i]).height); //extract dom's height
     imgs[i].style.width = curr_width + width_offset + "px";
     imgs[i].style.height = curr_height + height_offset + "px";
   }
}

如何用css处理图像的高度

3 个答案: