Question

我有一个关闭图像的div。它应该闪烁，直到我关闭div。我这样做了，

<script type="text/javascript" src="jquery-1.2.3.pack.js"></script>
<script type="text/javascript">
$(document).ready(function()
 {
//first slide down and blink the alert box
$("#object").animate({ 
    top: "0px"
  }, 2000       ).fadeOut(slow).fadeIn(slow).fadeOut(100).fadeIn(100).fadeOut(100).fadeIn(100).fadeOut(100).fadeIn(100);

 //close the message box when the cross image is clicked 
 $("#close_message").click(function()
 {
    audio.pause();
   $("#object").fadeOut("slow");

});
});
 </script>

现在div在代码中写了几次闪烁。如何才能使图像关闭

Answer 1

在jquery中使用 fadeToggle

var isFade = true;

function test() {
    if (!isFade) return false;
    $("#object").fadeToggle("slow", test);
}

$("#close_message").click(function () {
   $("#object").hide();// if you want to hide the images when is fadein
    isFade = false;
});
test();

的 DEMO

Answer 2

You can try this to blink until something stops it:

var toggleFn = function() {
    $("p").fadeToggle(500);
};

var intervalId = setInterval(toggleFn, 500);

var stopFadeFn = function() {
    clearInterval(intervalId);
};

setInterval(stopFadeFn, 5000);

在您的情况下，您不想使用计时器来停止淡入淡出，只需使用onclick即可运行stopFadeFn。

Answer 3

FIDDLE

使用setInterval调用函数

function toggleNow() {
    $("p").fadeToggle(500);
};

setInterval(toggleNow, 500);

Answer 4

使用jquery + css动画（JSFiddle DEMO）：

的组合

<style>
.glowWorm   {
    -webkit-animation: monofader 1s infinite;
    animation: monofader 1s infinite;
}

/* Chrome, Safari, Opera */
@-webkit-keyframes monofader {
    50% {opacity: 0.4;}
}

/* Standard syntax */
@keyframes monofader {
    50% {opacity: 0.4;}
}
</style>

<div id="object">Message</div>
<div id="close_message">Closer</div>
<script>
$(document).ready(function() {
        $("#object").addClass('glowWorm');
        $("#close_message").click(function() {
                audio.pause();
                // Fade entirely
                $("#object").fadeOut("slow");
                // Remove glow
            //  $("#object").removeClass('glowWorm');
            });

    });
</script>

如何关闭div直到它关闭？

4 个答案:

的 DEMO