jQuery如果宽度等于百分比答案

【问题标题】：jQuery if width is equal to percentagejQuery如果宽度等于百分比
【发布时间】：2014-05-02 15:52:54
【问题描述】：

我知道以像素为单位您可以执行此类操作，但使用百分比时，不会返回任何内容。如果我的 CSS 使用百分比，我将如何处理？我基本上需要查看具有特定值的 div，然后触发我的脚本的变体。

jQuery:

if ($(".modPopUp").css("width") == "32%" ){
    console.log("32%");
    $(".modPopUp:nth-child(3n-2)").css('margin-left', '0');
}
else if ($(".modPopUp").css("width") == "49%" ){
    console.log("49%");
    $(".modPopUp:nth-child(2n)").css('margin-left', '0');
}

【问题讨论】：

标签： jquery

【解决方案1】：

以这种方式获取宽度将始终以像素为单位返回，无论您如何设置它，因为它是computed value。 .width() 也是如此。您需要根据其父项的宽度计算出宽度。

如下所示：

Math.floor(($el.width()/$el.parent().width())*100)+"%"

您甚至可以将其放入您自己的插件中：

$.fn.widthPerc = function(){
    var parent = this.parent();
    return ~~((this.width()/parent.width())*100)+"%";
}

被称为：

if ($(".modPopUp").widthPerc() == "32%" ){

JSFiddle

【讨论】：

【解决方案2】：

尝试在你的条件之前计算你的元素在 px 中的百分比。

类似的东西：

var width = $('.modPopUp').width();
var parentWidth = $(document).offsetParent().width(); //Document or the element you want
var percent = 100*width/parentWidth;

之后：

if ($(".modPopUp").css("width") == percent ){

【讨论】：

【解决方案3】：

如果您有一个 div（或者您确实关心其中一个 div），您可以执行以下操作：使用 jQuery 选择元素，然后从选择器中获取 HTML 元素，也就是选择器中的第一个元素。然后就可以使用元素的style属性来获取元素的CSS了。

例如：

    if ($('.modPopUp')[0].style.width == "25%")
    {
       //Statements
    }

【讨论】：