Question

我想在页面加载时执行动画，但仅当css属性具有某个值时才执行。没有if语句，动画工作正常。这是我的代码：

$(document).ready(function() {

    if($("h1").css('font-size') == '36px'){

        $("h1").animate({
          "font-size" : "20px"
        }, 750);

    }

});

Answer 1

我认为您正在尝试使用font-size：36px的h1元素设置动画。然后你需要在做动画之前过滤这些元素，如下所示：

$(document).ready(function () {
    $("h1").filter(function () {
        return ($(this).css('font-size') == "36px");
    }).animate({
        "font-size": "20px"
    }, 750);
});

Answer 2

if( $('h1').eq(0).css('<property>') ) {
 ...
}

Answer 3

在等同字体大小时从代码中删除'px'：

if($("h1").css('font-size') == '36'){

        $("h1").animate({
          "font-size" : "20px"
        }, 750);

Answer 4

从OP的评论中，似乎样式表中的杂散规则导致将字体大小设置为预期之外的其他内容。

使用浏览器的DOM检查器可以轻松完成确定此操作的方法。通常，您可以右键单击元素，点击inspect（或类似的东西）并查看值的设置位置。

以下是一些更具体的使用方法：

Chrome - https://developers.google.com/chrome-developer-tools/docs/elements

Firefox - https://developer.mozilla.org/en-US/docs/DOM_Inspector/Introduction_to_DOM_Inspector

Internet Explorer - http://msdn.microsoft.com/library/gg589507(VS.85).aspx

javascript，如果某些东西有css属性值

4 个答案: