Question

我无法弄清楚如何在jQuery .css属性上设置时间
我找到了一个与我的问题最接近的答案 jQuery change CSS after a certain amount of time

这是我的代码：

<script>
    $(document).ready(function(){
        $("#homebutton,#title").click(function(){
            $("#title").css("font-size", "100%");  
            setTimeout(function(){ $("#title").css("font-size", "100%"); },2000)
        });
    });
</script>

我不知道这有什么问题。
看起来我上面提到的解决方案并不适合我。

提前谢谢你们

----------------------------------------- EDIT ----- -----------------------------------------

感谢响应人员，我想重新解释几件事情：

我最初在我的CSS中将font-size设置为150％，这意味着通过我的jQuery，我希望它将字体大小更改为100％。
我认为我误解了代码，我想要设置的是逐渐减少的时间和不计时器

基本上，我想使用带有转换的jquery来改变字体大小，而不是突然改变

Answer 1

问题是您首先立即设置font-size: 100%，然后在2秒后再次将其设置为相同值。即，你不是在改变CSS。

要在单击时设置css值，然后在2秒后将其设置为其他值，请在每次调用.css()时使用不同的值。例如，最初将字体大小减半，然后在2秒后将其恢复到正常大小：

$(document).ready(function(){
    $("#homebutton,#title").click(function(){
        $("#title").css("font-size", "50%");
        setTimeout(function(){ $("#title").css("font-size", "100%"); },2000);
    });
});

修改：要逐渐减小字体大小，您要使用.animate()：

$(document).ready(function(){
    $("#homebutton,#title").click(function(){
        $("#title").animate({ "font-size": "50%" }, 2000);
    });
});

演示： jsfiddle.net/Y6CrG/

Answer 2

在2秒超时后更改字体大小。例如：

$("#title").click(function(){
  $("#title").css("font-size", "100%");  
  setTimeout(function(){ $("#title").css("font-size", "80%"); },2000)                               
});

我在下面的jsfiddle中试过它，它对我来说很好。 http://jsfiddle.net/kianoshp/z9QeY/

Answer 3

您可以使用此功能：

  $('#title').animate({fontSize : '100%'});

如果要设置持续时间，可以使用这些

  $('#title').animate({fontSize : '100%'}, "slow");
  $('#title').animate({fontSize : '100%'}, "fast");

如何在一段时间后使用jQuery .css设置css？

3 个答案: