Увидел на одном сайте красивый эффект: ссылки, которые переливались из одного цвета в другой, когда над ними проходил курсор. После некоторого изучения, я пришел к выводу, что скрипт можно оптимизировать и сделать наиболее гибким. Предлагаю Вам воспользоваться этим скриптом.
За основу взят скрипт JSFX LinkFade от xtEns1on.net.ru. Скрипт этот кроссбраузерный, поэтому всем придется по вкусу. Его немного переделали для того, чтобы цвета можно было задавать не в самом скрипте, а со страницы. Еще одно удобство скрипта - его можно установить на страницу, и все ссылки на ней начнут переливаться. Не нужно будет менять весь сайт, чтобы установить эту примочку. Скачать измененный вариант скрипта можно тут: JSFX.js.
В самом начале нужно скачать JSFX.js и разместить у себя на сервере. В принципе, можете использовать ссылку на наш ресурс. Во втором варианте телодвижений будет гораздо меньше.
Теперь можно вставлять код на страницу. Код желательно ставить ближе к началу страницы, чтобы при ее загрузке не появились артефакты.
В скрипте LinkEndColor - это цвет, в который будет переливаться ссылка на странице при наведении на него курсора. Цвет задается в стандартном формате RGB без привычных дизайнерам решеток. Начальный цвет ссылки и ее цвет, когда курсор уйдет со ссылки, задается при помощи стилей. src="http://szenprogs.ru/scripts/JSFX.js" - это путь к скрипту. Меняете на свой, если собираетесь вызывать его со своего хоста, и закачали его к себе.
Внимание! При использовании скрипта не используйте в стилях псевдостили ссылок (hover, visited? и т.п.). Они могут испортить эффект от работы скрипта.
В принципе, с установкой кода - все. Можно наслаждаться результатом. Эффект вы можете увидеть на этой странице. Просто проведите мышью над ссылками.
Всем удачи!
Вы можете присоедениться к моему микроблогу в Твиттере @SzenProgs. Буду благодарен, если оцените мой труд, и щелкните по звездочкам ниже.
x;z-index:1 }Переливающиеся ссылки
Скрипты
Скрипты, инструкции, справочники
Категория: | Скрипты |
Просмотрено: | 13508 |
Рейтинг: | 4.2/16 |
Дата добавления: | 2009-07-14 10:36, Вторник |
Добавил: | Szen |
Теги: | переливаются, скрипт, ссылки |
№ 0 | 2009-07-14 10:36 |
Szen | Здесь вы можете задать вопрос или оставить комментарий по теме "Переливающиеся ссылки". |
Гость |
№ 1 | 2009-08-12 05:22 |
Mishgan | |
Михаил Батурин |