Любовь к спорту на всю жизнь
Привет, Гость!

  • Страница 1 из 1
  • 1
Форум » Всё для Ucoz » Меню для uCoz » Выезжающее меню с помощью jQuery
Выезжающее меню с помощью jQuery
Torres_1_Дата: Пятница, 06.08.2010, 01:39 | Сообщение # 1
Генералиссимус
Группа: Администраторы
Сообщений: 2124
Награды: 0
Репутация: 12
Статус: Offline
Новое горизонтальное меню для uCoz. Хорошо подойдет под светлые тона.

Скрин:


Вставляем данный код в верхнюю часть сайта.

Код
<link rel="stylesheet" href="http://www.fifagamers.do.am/vsio_dlya_ucoz/skripti1/menu/107_style.css" type="text/css" media="screen"/>

<div class="container">
     <ul id="menu">
     <li>
         <a href="/">
     <i class="icon_about"></i>
     <span class="title">О нас</span>
     <span class="description">
Прочти о нас и наших услугах
     </span>
     </a>
     </li>
     <li>
     <a href="/load">
     <i class="icon_work"></i>
     <span class="title">Файлы</span>
     <span class="description">
     Просмотреть работы
     </span>
     </a>
     </li>
     <li>
     <a href="/gb">
     <i class="icon_help"></i>
     <span class="title">Помощь</span>
     <span class="description">
     Связаться с поддержкой
     </span>
     </a>
     </li>
     <li>
     <a href="/search/?q">
     <i class="icon_search"></i>
     <span class="title">Поиск</span>
     <span class="description">
     Найти что-нибудь
     </span>
     </a>
     </li>
     </ul>
</div>

<script>
$(function() {
        $('#menu > li').hover(
            function () {
                var $this = $(this);
                $('a',$this).stop(true,true).animate({
                        'bottom':'-15px'
                    }, 300);
                $('i',$this).stop(true,true).animate({
                        'top':'-10px'
                    }, 400);
            },
            function () {
                var $this = $(this);
                $('a',$this).stop(true,true).animate({
                        'bottom':'-95px'
                    }, 300);
                $('i',$this).stop(true,true).animate({
                        'top':'50px'
                    }, 400);
            }
        );
};);
</script>


Заменяем ссылки и названия ссылок на свои и радуемся новому меню. Если есть вопросы, пишите в комментариях.
 
Форум » Всё для Ucoz » Меню для uCoz » Выезжающее меню с помощью jQuery
  • Страница 1 из 1
  • 1
Поиск:
Навигация
Главная страница Форум сайта Создание сайтов на uCoz Заработок в интернете Уроки Photoshop Автомобиль от А до Я Электроника Всё для смартфонов Браузерные игры Музыка Последние комментарии Статистика
Развлечения
Сегодня день рождения у: Описание сайта
Новое на форуме
Опрос
Опрос сайта
Ваша операционная система:
javascript:; javascript:;
Всего ответов: 147

Общение
Загрузка…
Статистика
Зарег. на сайте
Всего: 267
Новых за месяц: 0
Новых за неделю: 0
Новых вчера: 0
Новых сегодня: 0
Из них
Администраторов: 1
Модераторов: 0
Проверенных: 1
Обычных юзеров: 264
Из них
Парней: 234
Девушек: 33


Друзья сайта
Возможен баннерообмен 81х31.Писать ЛС.