Question

我找到了几个答案，但必须有一些我不理解的东西。

我需要以5秒的增量放置x 1分钟v，如60，淡入淡出55渐变到50等等。

这样做的页面是从php / ajax加载数据，但我无法弄清楚这部分是否存在冲突或是什么。

这就是我所拥有的：

var counter = 60;
$('#seks').html(counter);
var interval = setInterval(function() {
    counter=counter-5;
    $('#seks').fadeOut(slow).html(counter).fadeIn(slow);.
    if (counter == 5) {
        clearInterval(interval);
    }
}, 5000);

来自db的间隔函数更新，如下所示：

setInterval(function() {

    var fadeInData = function fadeInData() { $('#updateshere').fadeIn(); }
    var loadData = function loadData() {    $('#updateshere').load('http://launchpad-001.com/_firingRange/danTestPageHits/', fadeInData); }
    $('#updateshere').fadeOut(loadData);   
}, 60000);

我知道这很简单，我运行起来比较复杂，你可以在这个链接上看到一些，我需要把这个倒计时时钟放在那里。

但是，必须有一些我不知道的东西，因为我无法让它发挥作用。

这是要更新的HTML：

<div id="seks"></div>

对我来说，这看起来应该有效。

$(document).ready(function(){
    var counter = 60;

    $('#seks').html(counter);
    var interval = setInterval(function() {
        counter=counter-5;
        $('#seks').fadeOut(slow).html(counter).fadeIn(slow);.
        if (counter == 5) {
            clearInterval(interval);
        }
    }, 5000);
 });

Answer 1

你的尝试很接近，但没有考虑使用来自fx队列调用（fadeIn，fadeOut）的回调的想法。还要记住，slow需要是字符串"slow"，因为这是jquery所期望的，而不是引用变量的slow（假设你没有var slow = 1000某处）。

$(document).ready(function(){
 var counter = 60;

 var seks = $('#seks').html(counter);//save copy to reduce querying
 var interval = setInterval(function() {
    counter -= 5;
    seks.fadeOut('slow',function(){//use callback after animation
     seks.html(counter).fadeIn('slow');//now fade back in once out is done
    });
    if (counter == 5) {
        clearInterval(interval);
    }
 }, 5000);
});

倒计时从60开始，以5为增量

1 个答案: