jquery在x秒后显示并隐藏图像

时间:2012-07-03 00:18:30

标签: jquery

我想要显示和成像2秒钟并隐藏它以显示图表。我有一部分是图表在2秒后出现,但我不知道如何放置图像。

$("li").click(function(){
    //Toggle List
    $(this).toggleClass("active");
    $(this).next("div").stop('true','true').slideToggle();
    //SHOW image for 2 seconds and then HIDE IT
    var did = $(this).attr('id');
    var graphic;

    if($(this).next("div").html() == '')
        {
        graphic = '';
            $.ajax({
               url: 'pulse.php?did='+did, success: function(data)
             {
             graphic = data;
             }
        });
    }

    //Here I show the chart after 2 seconds pulling the data from pulse.php...
delay(function(){               
    $("#"+did).next("div").html(graphic);
    }, 2000 );
});


    //Delay function
var delay = (function(){
var timer = 0;
         return function(callback, ms){
         clearTimeout (timer);
         timer = setTimeout(callback, ms);
     };
})();

1 个答案:

答案 0 :(得分:0)

如果您的工作已经有效,我想这只是在正确的位置显示和隐藏图像元素的问题:

$("li").click(function(){
    $("#imageElementID").show(); //show image on click
    $(this).toggleClass("active");
    $(this).next("div").stop('true','true').slideToggle();
    //SHOW image for 2 seconds and then HIDE IT
    var did = $(this).attr('id'), graphic;
    if ($(this).next("div").html() === '') {
        graphic = '';
        $.ajax({
            url: 'pulse.php?did='+did, 
            success: function(data) {
                graphic = data;
            }
        });
    }
    delay(function(){               
        $("#imageElementID").hide(); //hide image after some sort of delay function ?
        $("#"+did).next("div").html(graphic);
    }, 2000 );
});​