Перейти к содержимому



Меню для сайта и операторы выбора на JS

#1 WebMaster

WebMaster
  • Пользователь
  • 97 сообщений
  • Репутация: 3
0

Отправлено 21 Сентябрь 2012 - 15:09

Всем привет! Кто не помнит, я не программист! Поэтому снова к Вам за помощью! В общем есть горизонтальное меню. Есть кнопки по умолчанию. Есть нарезанные картинки кнопок, которые должны появляться при наведении. Хотелось бы узнать как это реализовать на JS. У меня установлен и настроен JQuery.

Мне необходимо чтобы при наведении мыши на какой либо пункт меню вылазила другая картинка. Изначально установлена обычная горизонтальная полоса градиента. Потом при наведении на страницу, например, Главная, подключается изображение с вдавленым градиентом, например. И получается динамическое меню. Какой пример подскажите?

 

 

  • 0

robot

robot
  • Пользователь PRO
  • 2 652 сообщений
  • Репутация: 85
Советую обратить внимание на следующее:
  1. Звук для кнопок меню сайта
  2. Удобное меню для многостраничного сайта
  3. Форма обратной связи на Javascript + HTML помогите!
  4. Выпадающее меню
  5. Как сделать меню без перезагрузки контента?

#2 surfer

surfer
  • Заблокированные
  • 1 956 сообщений
  • Репутация: 71

Отправлено 21 Сентябрь 2012 - 16:20

тебя не поймешь, то ты знаток html5, то уже не программист,
это вполне реализуется и без js погугли решений валом.
  • 0

#3 WebMaster

WebMaster
    Topic Starter
  • Пользователь
  • 97 сообщений
  • Репутация: 3

Отправлено 21 Сентябрь 2012 - 20:33

не, я потом еще анимацию добавлю... HTML5 знаю, JS нет.
  • 0

#4 surfer

surfer
  • Заблокированные
  • 1 956 сообщений
  • Репутация: 71

Отправлено 22 Сентябрь 2012 - 01:43

а причем здесь анимация? ТЫЦ
  • 0

#5 WebMaster

WebMaster
    Topic Starter
  • Пользователь
  • 97 сообщений
  • Репутация: 3

Отправлено 22 Сентябрь 2012 - 04:34

Чтобы плавно появлялась картинка при наведении а не просто резко выскакивала...
  • 0

#6 yury

yury
  • Пользователь
  • 631 сообщений
  • Репутация: 179

Отправлено 22 Сентябрь 2012 - 19:33

Для смены изображения на кнопках меню JS не требуется.
Пример:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ru" lang="ru">
<head>
<title>tst</title>
<style type="text/css">
*{
margin: 0;
padding: 0;
}
ul#menu{
list-style: none;
width: 1000px;
height: 36px;
background: url(menu1.png) 0 0 repeat-x;
}
ul#menu li{
float: left;
padding-left: 1px;
font: normal 12px/38px Verdana, Geneva, "DejaVu Sans", sans-serif;
height: 36px;
background: url(menu1.png) 0 -36px no-repeat;
}
ul#menu li a{
float: left;
padding: 0 14px;
height: 36px;
color: #333;
text-decoration: none;
text-transform: uppercase;
}
ul#menu li a:hover,
ul#menu li a#cur{
color: #90f;
background: url(menu1.png) 0 -72px repeat-x;
}
</style>
</head>
<body>
<ul id="menu">
<li><a href="#">Главная</a></li>
<li><a href="#">Наши преимущества</a></li>
<li><a href="#">Прайс-лист и каталог</a></li>
<li><a href="#" id="cur">Контакты</a></li>
<li><a href="#">Регистрация продукта</a></li>
</ul>
</body>
</html>
Картинка, используемая в примере (menu1.png размером 1 на 108 px) — menu1.png
  • 1

#7 leonid

leonid
  • Неактивные
  • 16 сообщений
  • Репутация: 0

Отправлено 24 Сентябрь 2012 - 22:49

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


Оформление форума – IPBSkins.ru