Навигация на многих сайтах очень скучна,правда? Тк давайте сделаем вместе с вами красивую навигацию
Как всегда, делаем навигацию неупорядоченным списком по стандарту XHTML.
<ul> <li><a class="nav" href="#">Пункт 1</a></li> <li><a class="nav" href="#">Пункт 2</a></li> <li><a class="nav" href="#">Пункт 3</a></li> <li><a class="nav" href="#">Пункт 4</a></li> <li><a class="nav" href="#">Пункт 5</a></li> <li><a class="nav" href="#">Пункт 6</a></li> <li><a class="nav" href="#">Пункт 7</a></li> <li><a class="nav" href="#">Пункт 8</a></li> <li><a class="nav" href="#">Пункт 9</a></li> <li><a class="nav" href="#">Пункт 10</a></li> </ul>
И создадим стиль для класса nav.
.nav { background:#000; color:#ddd; display:block; width:200px; }
А теперь сам код на MooTools:
window.addEvent('domready', function() {
$each($$('a.nav'),function(el) {
el.addEvent('mouseenter', function() {
el.highlight(el.getStyle('background-color'),'#333');
});
el.addEvent('mouseleave', function() {
el.highlight(el.getStyle('background-color'),'#000');
});
});
});
Как только DOM загружен мы у ссылки с классом nav по mouseenter и mouseleave изменяем свойство background-color. Вот так. Все очень простои легко
Посмотреть пример.
Скачать архив.
Случайные посты:




Спасиб за совет, шя будем пробовать.
[Ответить]
Я с mootools встретился недавно(2 дня назад) и у мя тут же возникает вопрос: А это класс подходит под движок DLE ???
[Ответить]
не очень понял)) какой класс?
[Ответить]