Здарова, прогеры! Помогите, пожалуйста, новичку в JavaScript. В меню есть ссылочка a#shining-text, по которой пробегает блик. Но при наведении мышки на эту ссылку, этот скрипт (блик) должен останавливаться, а ссылка гореть белым цветом
Выглядит так: сама ссылка серая, по ней для привлечения внимания бегает блик. При наведении на ссылку, блик должен перестать бегать, а сама ссылка загореться белым (hover).
Сам скрипт:
(function($) {
$.fn.textAnimation = function(settings) {
var container = this;
settings = $.extend({
mode : "roll"
}, settings);
function parse(e){
if(e.hasClass("isTextAnimated")) return;
var text = e.text();
e.html("");
for(var i=0;i< text.length;i++) {
var span = $("<span></span>").text(text.charAt(i));
e.append(span);
}
e.addClass("isTextAnimated");
}
function parseDiv(e,width,verticalAlign){
if(e.hasClass("isTextAnimated")) return;
var text = e.text();
e.html("");
//css setting
var css = {position:"absolute"};
verticalAlign = verticalAlign || "bottom";
css[verticalAlign] = "0px";
//width setting
if(width === false) width = e.css("fontSize").replace(/px/,"")/1.25;
for(var i=0;i< text.length;i++) {
css.left = width*i;
var div = $("<div></div>").text(text.charAt(i)).css(css);
e.append(div);
}
e.addClass("isTextAnimated").css({position:"relative"});
}
function execute(options,start,finish){
var time = options.time;
var interval = options.interval;
var repeat = options.repeat;
var startId;
var amountInterval = interval + time;
if(finish) amountInterval*=2;
var e = options.e;
if (options.onStart) {
e.bind(options.onStart, function(){
if (startId) return;
start();
if (repeat) {
startId = setInterval(start, amountInterval);
if (finish) {
setTimeout(function(){
finish();
if (repeat)
setInterval(finish, amountInterval);
}, amountInterval / 2);
}
}
});
} else {
start();
if(repeat) setInterval(start, amountInterval);
if(finish) {
setTimeout(function(){
finish();
if(repeat) setInterval(finish, amountInterval);
},amountInterval/2);
}
}
if (options.onFinish) {
e.bind(options.onFinish, function(){
if (startId && repeat) {
clearInterval(startId);
startId = false;
}
if(finish) finish();
});
}
}
var f = {
highlight:function(e){
var options = $.extend({
e : e,
baseColor : "#666666",
highlightColor : "#FFFFFF",
delay : 50,
interval : 1500,
duration : 300,
repeat : true,
onStart : false,
onFinish : false
},settings);
parse(e);
var i = 0;
var elements = e.children().css({color:options.baseColor});
var length = elements.length;
if(!options.interval && !options.delay) options.interval = 100;
var hc = options.highlightColor;
var bc = options.baseColor;
var du = options.duration;
var de = options.delay;
var start = function(){
elements.each(function(i){
var s = $(this);
setTimeout(function(){
s.animate({
color: hc
}, {
duration: du
}).animate({
color: bc
},{
duration: du
});
},de*i);
});
};
options.time = (options.delay * length);
execute(options,start);
}
};
return container.each(function(){
f[settings.mode]($(this));
});
};
})(jQuery);
Запуск скрипта:
$(document.body).ready(function(){
$("a#shining-text").textAnimation({
mode: "highlight"
});
});
А если все же через JS события onmouse?
