Question

我想检查我的元素宽度是否大于100％ - 所以如果div是113.42％隐藏其他内容，但我无法隐藏元素。

现在，我已将此设置为测试，如果宽度大于100％，则将背景设为黑色，否则将背景设为红色。现在，元素是红色的，但大于100％的元素不会变黑。有人可以指出我做错了什么吗？它也是我想用.display-area在每个元素上检测到的所有元素 - 我是否必须使用.each函数？

        var $displayarea = $(".display-area");
        var width = $('.display-area').width();
        var parentWidth = $('.display-area').offsetParent().width();
        var percent = 100*width/parentWidth;
//      var per = $('.first-div').width() * .80;
//      if ( $displayarea.width() > "100%" )  {
        if ($displayarea.css("width") > percent ) {
                $displayarea.css({ 
                        background: 'black'
                });

        } else {

                $displayarea.css({
                        background: 'red'
                });

        }

Answer 1

我不知道这是你所追求的，但你可以查看一个演示here。

List

Answer 2

您可以使用各自的html选择器来比较css标记和元素的宽度。

if($('div').css("width").replace("px","") > $('html').css("width").replace("px",""))
    alert($('div').css("width").replace("px","") - $('html').css("width").replace("px","")  + " more");

Answer 3

这里可能是您正在搜索的内容：

var parent = $('.parentDiv').width();
var child = $('.childDiv').width();

var percent = child * 100 / parent;

if (percent > 100) {
   $('.childDiv').css('background-color', '#000')
} else {
   $('.childDiv').css('background-color', '#f00')
}

Answer 4

您需要检查调整大小事件

like $('.display-size').bind('resize',function(){
//logic
})

如何检查元素宽度是否大于100％

4 个答案: