Плагин jQuery.Matrix

Простой плагин создания эффекта матрицы для текста.

Демо

jQuery.fn.matrix = function (options) {
    var options = jQuery.extend({
	  mask: "QWERTYUIOPASDFGHJKLZXCVBNMЙЦУКЕНГШЩЗХЪФЫВАПРОЛДЖЭЯЧСМИТЬБЮЁ",
	  speed: 100
	}, options);
 
    var iteration = function (obj, i, char, n) {
	    var char_obj = obj.find('#char'+i);
		if(n < 0) {
			var rand = Math.ceil(options.mask.length*Math.random()) - 1; // random between 0 - options.mask.length
			char_obj.text(options.mask[rand]);
			setTimeout(function () {
				iteration(obj, i, char, n - 1);
			}, options.speed);
		} else {
		    char_obj.text(char);
		}
	};
	return this.each(function () {
		var obj = jQuery(this);
		var text = obj.text();
		var text_length = text.length;
		var array = new Array(text_length);
 
		for(var i = 0; i < text_length; i++) {
			if(text.charAt(i) != ' ' && text.charAt(i) != '\n') {
				array[i] = '<span id="char' + i + '">' + text.charAt(i) + '</span>';
			} else {
			    array[i] = text.charAt(i);
			}
		} 
 
		obj.html('<pre>' + array.join('') + '</p' + 're>');
 
		for(var i = 0; i < text_length; i++) {
		    if(text.charAt(i) != ' ' && text.charAt(i) != '\n') {
		    	var rand = Math.ceil(100*Math.random()); // random between 1 - 100
		    	var time = (1 + 5 * rand / 100) * 1000; // time in milisec
		    	var repeat = Math.round( time / options.speed );
		    	iteration(obj, i, text.charAt(i), repeat);
		    }
		}
	});
};

Рубрики



Ссылки


наверх