Как подделать флеш анимацию в навигации
Вы видели когда-то интересный приём на сайтах - наводишь на ссылку а она светится потом гаснет? Ну, или что-то другое. Это флеш-анимация, которую пока-что нельзя перенести на ксс и хтмл, но вполне можно подделать. Демонстрации этого эффекта у меня нету, т.к. сам я им пользовался довольно-таки давно. В чём суть:
используя скрипт замены картинки при наведении, вы можете создать гифку с красивым эффектом.
Пример: в обычном состоянии картинка просто стоит, при наведении - текст постепенно становится ярче, или же под ним рисуется линия. Сам скрипт выглядит так:
Код: <script><!--Свои картинки в панель навигации со сменой картинки по наведению курсора" -->
navlinks=new Array(
"navextra1", // Дополнительный пункт меню 1
"Ссылка на картинку","Ссылка на картинку при наведении",
"navextra2", // Дополнительный пункт меню 2
"Ссылка на картинку","Ссылка на картинку при наведении",
"navextra3", // Дополнительный пункт меню 3
"Ссылка на картинку","Ссылка на картинку при наведении",
"navindex", // Форум
"Ссылка на картинку","Ссылка на картинку при наведении",
"navuserlist", // Участники
"Ссылка на картинку","Ссылка на картинку при наведении",
"navrules", // Правила
"Ссылка на картинку","Ссылка на картинку при наведении",
"navsearch", // Поиск
"Ссылка на картинку","Ссылка на картинку при наведении",
"navprofile", // Профиль
"Ссылка на картинку","Ссылка на картинку при наведении",
"navpm", // Сообщения
"Ссылка на картинку","Ссылка на картинку при наведении",
"navadmin", // Администрирование
"Ссылка на картинку","Ссылка на картинку при наведении",
"navregister", // Регистрация
"Ссылка на картинку","Ссылка на картинку при наведении",
"navlogin", // Войти
"Ссылка на картинку","Ссылка на картинку при наведении",
"navlogout", // Выход
"Ссылка на картинку","Ссылка на картинку при наведении" // !ПОСЛЕДНИЙ элемент без запятой
)
var s0,s1,s2,s3,i; for (i=0; i < navlinks.length; i++){s0=navlinks[i+1];s1="onmouseover=\"this.src='"+navlinks[i+2]+"'\""; s2="onmouseout=\"this.src='"+s0+"'\"";s3='<img class="navlinks" src="'+s0+'" '+s1+' '+s2+' border="0" />';$("#"+navlinks[i]+" a").html("<span>"+s3+"</span>");i++;i++; }
</script>
Первые три пункта можно убрать, если у вас нету доп. кнопок в меню.
Если используем скрипт информирующий о новых сообщениях, ставим его раньше данного скрипта.