实现文本闪烁效果，这里使用了jQuery，大概有2个方法
- 扩展jquery方法。
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 |
(function ($) { var my_blink_plug_name = "myblink"; $.fn[my_blink_plug_name] = function( options ) { var defaults = { delay: 100, max_count: 0, before_blink: function (obj){}, after_blink: function (obj){} }; this.settings = $.extend( {}, defaults, options ); var _this = this; var c = 0; _this.settings.before_blink(_this); var myVar = setInterval(function() { if (_this.css("visibility") == "visible") { _this.css('visibility', 'hidden'); } else { _this.css('visibility', 'visible'); if(_this.settings.max_count > 0) { c ++; if(c == _this.settings.max_count){ clearInterval(myVar); _this.settings.after_blink(_this); } } } }, _this.settings.delay); return this; }; }( jQuery )); |
调用：
|
1 2 3 4 5 6 7 8 9 10 |
$("div").myblink({ interval: 300, //闪动间隔时间，默认为100 blink_count: 3, //最大闪动次数，0表示无限 before_blink: function (obj){ //闪动前回调方法 $(obj).css({color: "red"}); }, after_blink: function (obj){ //闪动结束回调方法 $(obj).css({color: "black"}); } }); |
Demo：查看演示
- 简单地使用jQuery的fadeIn()和faceOut()方法
|
1 |
$("#someElement").fadeIn(100).fadeOut(100).fadeIn(100).fadeOut(100).fadeIn(100); |
Demo：查看演示