一段时间后，如何使用jQuery .css设置CSS? [英] How do I set css using jQuery .css after a period of time?

问题描述

我不知道如何在jQuery .css属性上设置时间
我找到了一个最接近我的问题的答案 jQuery在一定时间后更改CSS

I couldn't figure out How to set time on jQuery .css property
I found one answer which is the closest to my question in 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>

我不知道这是怎么回事.
看来我上面提到的解决方案对我不起作用.

预先谢谢大家

I don't know what is wrong with that.
It seems like the solution I mentioned above doesn't work for me.

Thank you in advance guys

-----------------------------------------编辑----- -----------------------------------------

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

感谢响应者，有几件事我想重新解释一下:

Thanks for the response folks, there are several things that I want to re-explain:

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

1. I initially set the font-size to 150% in my CSS, which mean through my jQuery, I expected it to change the font-size into 100%.
2. I think I've misinterpreted the code, what I wanted to set is the time for decreasing gradually and not the timer

基本上，我想使用带有过渡的jquery来更改字体大小，而不是突然更改

Basically, I want to change the font-size using jquery with transition, and not a sudden change

推荐答案

麻烦的是，您首先立即设置font-size: 100%，然后在2秒钟后再次将其设置为相同的值.即，您没有更改CSS.

The trouble is you first set font-size: 100% immediately, then you set it to the same value again after 2 seconds. Ie, you aren't changing the css.

要在单击时设置css值，然后在2秒后将其设置为其他值，请在每次对.css()的调用中使用不同的值.例如，首先将字体大小减小一半，然后在2秒后将其恢复为正常大小:

To set the css value when clicked, and then set it to something else 2 seconds later, use different values in each call to .css(). Eg, to decrease the font size by half initially, then bring it back to normal size 2 seconds later:

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

:要逐渐减小字体大小，请使用.animate():

To gradually decrease the font size, you want to use .animate():

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

演示: jsfiddle.net/Y6CrG/

这篇关于一段时间后，如何使用jQuery .css设置CSS?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！