У меня есть несколько кнопок на странице, цвет которых изменяется с помощью jQuery, показывая, какая из них активна. Я хотел бы добавить изменение цвета ТОЛЬКО при наведении курсора, после чего он возвращается к исходному цвету (который продиктован jQuery), когда его оставляют.
Сначала я использовал css: .showlink li:hover {color:#aaa;}
, который работает правильно, за исключением того, что когда страницы переключаются, а jQuery меняет цвета, он заменяет CSS.
Затем я решил использовать простой jQuery, который говорит, что когда что-то наведено, измените его цвет. это не работает полностью, потому что оно постоянно меняет цвет. Чтобы смягчить это, я немного добавил функцию, которая возвращает ему другой цвет.
Можно ли каким-то образом вернуть ему исходный цвет, который был до того, как он был изменен при наведении курсора?
// Changes color on hover
$(function() {
$('.showlink').hover(function(){
$(this).css('color', '#aaa');
},
function(){
$(this).css('color', '#f3f3f3');
});
});
//Changes color depending on which page is active, fades that page in
$(function(){
$('#show_one').css('color', '#ffcb06');
$('#two, #three').hide();
});
$('.showlink').click(function(){
$('.showlink').css('color', '#f3f3f3');
$(this).css('color', '#ffcb06');
var toShow = this.id.substr(5);
$('div.page:visible').fadeOut(600, function(){
$('#' + toShow).fadeIn(600);
});
});