Я работаю над сайтом с тонкими темно-серыми пунктами меню в верхней части каждой страницы. Меню построено с использованием списка и немного CSS и HTML. В настоящее время используется идентификатор в BODY для выделения пункта меню, который соответствует странице, которую вы просматриваете.
Я пытаюсь добиться того, чтобы при загрузке страницы каждый элемент меню в списке поочередно изменял цвет с темно-серого на свой. Hover, а затем постепенно переходил в темно-серый. Намерение состоит в том, чтобы показать зрителю, что меню присутствует, но затем сделать меню менее навязчивым, чем стилизованное.
HTML (показаны только соответствующие биты кода)
<head>
<!-- InstanceParam name="id" type="text" value="inno" -->
</head>
<body id="@@(id)@@">
<div class="big-nav-inline"><ul>
<li><a href="../markets.htm" class="marknav">Markets</a></li>
<li><a href="../science-and-technology.htm" class="technav">Technology</a></li>
<li><a href="../innovation.htm" class="innonav">Innovation</a></li>
<li><a href="../ventures.htm" class="ventnav">Ventures</a></li>
</ul></div>
</body>
Объяснение CSS (полный код в настоящее время слишком раздут для вставки)
Я использую класс div для позиционирования на странице.
Я использую класс каждого элемента списка, чтобы задать другой цвет элемента списка .hover
Я использую <body id="">, чтобы выделить элемент списка текущей страницы и изменить цвет рамки на странице.
Надеюсь, вы можете помочь !!!
Что мне нужно использовать, чтобы получить эффект после? Кто-нибудь из вас делал это просто?
С наилучшими пожеланиями
Пол