即日起在codingBlog上分享您的技术经验即可获得积分,积分可兑换现金哦。

文字闪烁的jQuery

栈溢出 HP. 69℃ 0评论
本文目录
[隐藏]

1.原始问题:Text blinking jQuery

What is an easy way to make text blinking in jQuery and a way to stop it? Must work for IE, FF and Chrome. Thanks

2.被采纳答案

Try using this blink plugin

For Example

$('.blink').blink(); // default is 500ms blink interval.
//$('.blink').blink(100); // causes a 100ms blink interval.

It is also a very simple plugin, and you could probably extend it to stop the animation and start it on demand.

3.其他高票答案

3.1.第1个答案

A plugin to blink some text sounds a bit like overkill to me…

Try this…

$('.blink').each(function() {
    var elem = $(this);
    setInterval(function() {
        if (elem.css('visibility') == 'hidden') {
            elem.css('visibility', 'visible');
        } else {
            elem.css('visibility', 'hidden');
        }    
    }, 500);
});

3.2.第2个答案

here’s blinking with animation:

$(".blink").animate({opacity:0},200,"linear",function(){
  $(this).animate({opacity:1},200);
});

just give a blink class whatever u want to blink:


all regards to DannyZB on #jquery

features:

  • doesn’t need any plugins (but JQuery itself)
  • does the thing

3.3.第3个答案

If you’d rather not use jQuery, this can be achieved with CSS3

@-webkit-keyframes blink {  
  from { opacity: 1.0; }
  to { opacity: 0.0; }
}

blink {
  -webkit-animation-name: blink;  
  -webkit-animation-iteration-count: infinite;  
  -webkit-animation-timing-function: cubic-bezier(1.0,0,0,1.0);
  -webkit-animation-duration: 1s; 
}

Seems to work in Chrome, though I thought I heard a slight sobbing noise.

3.4.第4个答案

Combine the codes above, I think this is a good solution.

function blink(selector){
    $(selector).animate({opacity:0}, 50, "linear", function(){
        $(this).delay(800);
        $(this).animate({opacity:1}, 50, function(){
        blink(this);
        });
        $(this).delay(800);
    });
}

At least it works on my web.
http://140.138.168.123/2y78%202782

转载请注明:CodingBlog » 文字闪烁的jQuery

喜欢 (0)or分享 (0)
发表我的评论
取消评论

*

表情