Да, это определенно возможно.
Чтобы немного попрактиковаться, я написал для вас плагин jQuery blinker:
jQuery:
(function($){
// **********************************
// ***** Start: Private Members *****
var pluginName = 'blinker';
var blinkMain = function(data){
var that = this;
this.css(data.settings.css_1);
clearTimeout(data.timeout);
data.timeout = setTimeout(function(){
that.css(data.settings.css_0);
}, data.settings.cycle * data.settings.ratio);
};
// ***** Fin: Private Members *****
// ********************************
// *********************************
// ***** Start: Public Methods *****
var methods = {
init : function(options) {
//"this" is a jquery object on which this plugin has been invoked.
return this.each(function(index){
var $this = $(this);
var data = $this.data(pluginName);
// If the plugin hasn't been initialized yet
if (!data){
var settings = {
css_0: {
color: $this.css('color'),
backgroundColor: $this.css('backgroundColor')
},
css_1: {
color: '#000',
backgroundColor: '#F90'
},
cycle: 2000,
ratio: 0.5
};
if(options) { $.extend(true, settings, options); }
$this.data(pluginName, {
target : $this,
settings: settings,
interval: null,
timeout: null,
blinking: false
});
}
});
},
start: function(){
return this.each(function(index){
var $this = $(this);
var data = $this.data(pluginName);
if(!data.blinking){
blinkMain.call($this, data);
data.interval = setInterval(function(){
blinkMain.call($this, data);
}, data.settings.cycle);
data.blinking = true;
}
});
},
stop: function(){
return this.each(function(index){
var $this = $(this);
var data = $this.data(pluginName);
clearInterval(data.interval);
clearTimeout(data.timeout);
data.blinking = false;
this.style = '';
});
}
};
// ***** Fin: Public Methods *****
// *******************************
// *****************************
// ***** Start: Supervisor *****
$.fn[pluginName] = function( method ) {
if ( methods[method] ) {
return methods[method].apply( this, Array.prototype.slice.call( arguments, 1 ));
} else if ( typeof method === 'object' || !method ) {
return methods.init.apply( this, arguments );
} else {
$.error( 'Method ' + method + ' does not exist in jQuery.' + pluginName );
}
};
// ***** Fin: Supervisor *****
// ***************************
})( jQuery );
Посмотрите это в действии здесь
Плагин и скрипка довольно сыры, потому что я не пытался интегрироваться с jQuery-ui-tabs.Это может быть легко или сложно, я не знаю, но при условии, что каждая вкладка адресуема по классу или идентификатору, тогда это не должно быть слишком сложным.
Что-то, что вы, возможно, должны учитывать, это остановка мигающей вкладки при нажатии на нее.Для этого вы можете вызвать метод .blinker('stop') напрямую (с помощью обработчика .on('click')) или из соответствующего обратного вызова jQuery-ui-tabs.
API
Плагин правильно написан в предпочтительном шаблоне jQuery .Он помещает только один член в пространство имен jQuery.fn и .blinker(...) будет цепочкой, как стандартные методы jQuery.
Методы :
- .blinker ('init' [, options]) : Инициализирует выбранный элемент (ы) с поведением блинкера,Вызывается автоматически с помощью
.blinker(options) или просто .blinker() в простейшем виде. - .blinker ('start') : заставляет выбранные элементы начать мигать между двумя стилями какопределяется по умолчанию плагина и / или options .
- .blinker ('stop') : заставляет выбранные элементы перестать мигать и вернуться к своему естественному CSSстиль (ы).
Опции : карта свойств, которые определяют стили и время мигания:
- css_0 : (необязательно) карта свойств css, представляющая состояние выключенного мигания.
- css_1 : карта свойств CSS, представляющая состояние включенного мигания.
- цикл : время цикла мигания в миллисекундах (по умолчанию 2000).
- коэффициент : время включения как доля времени цикла (по умолчанию 0,5).
Опуская css_0 в карте параметров, состояние OFF определяется естественным стилевым оформлением CSS элемента (ов), определенным в другом месте (обычно втаблица стилей).
Значения по умолчанию жестко заданы для css_1.color, css_1.backgroundColor, cycle времени и ratio.Изменение настроек по умолчанию программным способом не обрабатывается, поэтому для различных стилей по умолчанию плагин необходимо будет отредактировать.