Переливающиеся ссылки

Скрипты

Рисунок Переливающиеся ссылки
x;z-index:1 }
Переливающиеся ссылки Переливающиеся ссылки
оценка: 4.2 из 5
оценок: 16, отзывов: 1

Увидел на одном сайте красивый эффект: ссылки, которые переливались из одного цвета в другой, когда над ними проходил курсор. После некоторого изучения, я пришел к выводу, что скрипт можно оптимизировать и сделать наиболее гибким. Предлагаю Вам воспользоваться этим скриптом.

За основу взят скрипт JSFX LinkFade от xtEns1on.net.ru. Скрипт этот кроссбраузерный, поэтому всем придется по вкусу. Его немного переделали для того, чтобы цвета можно было задавать не в самом скрипте, а со страницы. Еще одно удобство скрипта - его можно установить на страницу, и все ссылки на ней начнут переливаться. Не нужно будет менять весь сайт, чтобы установить эту примочку. Скачать измененный вариант скрипта можно тут: JSFX.js.

В самом начале нужно скачать JSFX.js и разместить у себя на сервере. В принципе, можете использовать ссылку на наш ресурс. Во втором варианте телодвижений будет гораздо меньше.

Теперь можно вставлять код на страницу. Код желательно ставить ближе к началу страницы, чтобы при ее загрузке не появились артефакты.

Code
<script type="text/javascript">
  LinkEndColor = 'EAA860';
</script>
<script type="text/javascript" src="http://szenprogs.ru/scripts/JSFX.js"></script>

В скрипте LinkEndColor - это цвет, в который будет переливаться ссылка на странице при наведении на него курсора. Цвет задается в стандартном формате RGB без привычных дизайнерам решеток. Начальный цвет ссылки и ее цвет, когда курсор уйдет со ссылки, задается при помощи стилей. src="http://szenprogs.ru/scripts/JSFX.js" - это путь к скрипту. Меняете на свой, если собираетесь вызывать его со своего хоста, и закачали его к себе.

Внимание! При использовании скрипта не используйте в стилях псевдостили ссылок (hover, visited? и т.п.). Они могут испортить эффект от работы скрипта.

В принципе, с установкой кода - все. Можно наслаждаться результатом. Эффект вы можете увидеть на этой странице. Просто проведите мышью над ссылками.

Всем удачи!

Вы можете присоедениться к моему микроблогу в Твиттере @SzenProgs. Буду благодарен, если оцените мой труд, и щелкните по звездочкам ниже.

x;z-index:1 }


Переливающиеся ссылки
Скрипты
Скрипты, инструкции, справочники

rss
Категория:Скрипты
Просмотрено:13363
Рейтинг:4.2/16
Дата добавления:2009-07-14 10:36, Вторник
Добавил:Szen
Теги:переливаются, скрипт, ссылки

Мини-форум

№ 02009-07-14 10:36
Szen
Аватар участника Szen
Здесь вы можете задать вопрос или оставить комментарий по теме "Переливающиеся ссылки".
Гость
№ 1
2009-08-12 05:22
Mishgan
Аватар участника Mishgan
thumb
Михаил Батурин
Учавствовать в обсуждении "Переливающиеся ссылки" могут только зарегистрированные пользователи.
Реклама
Кнопка портала
Посетители
Зарегистрированных посетителей не было.
Друзья портала
Вакантное место для вашей рекламы!
RSS лента Блога
RSS лента Каталога файлов
RSS лента Новостей
Будьте в курсе событий.
Введите ваш email:

Личный блок
  • Гость портала.
  • Личных данных нет.
Вход на сайт
Регистрация
Опрос
Сколько сайтов у вас есть?
Всего ответов: 1846
Статистика
Valid HTML 4.01 Transitional

Яндекс цитирования



Онлайн всего: 5
Гостей: 5
Пользователей: 0
Портал SzenProgs.ru © 2008 - 2024 · Условия
Администратор и дизайнер портала: Szen
Хостинг от uCoz