Интересный плагин, который позволит вам плавно изменять цвет текста, фона под текстом и обводки вокруг текста
Установка:
После /head на страницах, где будет использован данный плагин, вставляйте:
Code
<script type="text/javascript" src="/js/jquery.color.js" ></script>
Следующий код вставляйте сразу после предыдущего:
Code
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery(".text").mouseover(
function () {
jQuery(this).animate({
color:"#ff0000"
}, 500 );
});
jQuery(".text").mouseout(function() {
jQuery(this).animate({
color:"#000"
}, 500 );
});
});
</script>
Немного разберём настройки:
.text - класс, к кторорому будет применяться эффект
mouseover, mouseout - функция при наведении/отведении курсора (выполнение скрипта при этих условиях)
color - к какому элементу будет выполняться эффект (backgroundColor - цвет фона; color - цвет текста; outlineColor - цвет обводки; borderBottomColor, borderLeftColor, borderRightColor, borderTopColor - цвет пунктирной обводки [низ, лево, право, верх] )
#ff0000 - цвет текста при наведении курсора
#000 - цвет текста при отведении курсора
500 - скорость смены цвета
Текст, к которому будет применяться эффект, прописывается так:
Code
<span class="text">Меняем цвет текста при наведении мыши</span>
Осталось лишь залить скрипт из прикреплённого архива в папку js
Материал подготовлен Apocalypse