|
|
Регистрация Восстановить пароль |
Повторная активизация e-mail |
Регистрация | Задать вопрос |
Заплачу за решение |
Новые сообщения |
Сообщения за день |
Расширенный поиск |
Правила |
Всё прочитано |
|
Опции темы | Поиск в этой теме |
12.06.2016, 02:13 | #1 |
Пользователь
Регистрация: 06.11.2012
Сообщений: 64
|
Анимированное меню..
Учусь делать анимированное меню. Возникли вопросы.. Не могу разобраться..
задание:нужно добавить в начало две кнопки: одну-для скрытия элементов, другую – для отображения скрытых элементов. Настроить методы click( ) кнопок, так чтобы они то скрывали, то отображали элементы первый вопрос по css - делаю фоновую картинку - и чтоб на ней менюшка была , а она не отображается.. Почему-то белым цветом просто весь основной фон становится..Как сделать, чтоб она была видна?? второй вопрос JQuery - проблема с кнопками.. не реагируют.. как-то не так записала чтоли??как на списки заставить их отзываться? Код HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html > <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" /> <title>Менюшка</title> <meta name="Keywords" content=""> <meta name="Description" content=""> <link rel="stylesheet" type="text/css" href="style.css"/> <script type="text/javascript" src="vertical-sliding-menu-described/js/jquery-latest.js"></script> </head> <body> <div id="menu_pop"> <input type="button" value="Скрыть" id="btn1"> <input type="button" value="Отобразить" id="btn2"> <ul id="accordion"> <li><div class=leto>Летние цветы<br> <span class="button_podtext">Что нас радует летом?</span></div> <ul> <li><a href="#">Ромашки</a></li> <li><a href="#">Розы</a></li> <li><a href="#">Колокольчики</a></li> <li><a href="#">Васильки</a></li> </ul> </li> <li><div class=osen>Осенние цветы <br> <span class="button_podtext">Что нас радует осенью?</span></div> <ul> <li><a href="#">Астры</a></li> <li><a href="#">Георгины</a></li> <li><a href="#">Хризантемы</a></li> <li><a href="#">Флоксы</a></li> </ul> </li> <li><div class=zima>Зимние цветы<br> <span class="button_podtext">Чем восхищаемся зимой?</span></div> <ul> <li><a href="#">Азалия</a></li> <li><a href="#">Камелия</a></li> <li><a href="#">Декабрист</a></li> <li><a href="#">Орхидея</a></li> </ul> <li><div class=vesna>Весенние цветы<br> <span class="button_podtext">Что нас радует весной?</span></div> <ul> <li><a href="#">Подснежники</a></li> <li><a href="#">Ландыши</a></li> <li><a href="#">Тюльпаны</a></li> <li><a href="#">Нарциссы</a></li> </ul> </li> </ul> </div> </body> <script> $("#accordion > li > div").click(function(){//при нажатии на любой div if(false == $(this).next().is(':visible')) {// вызывается подменю.. $('#accordion ul').slideUp(280);//сворачиваем } $(this).next().slideToggle(280); }); $("#but1").click(function(){ $("#accordion ul").slideUp(3000)}); $("#but2").click(function(){ $("#accordion ul").slideDown(3000)}); </script> </html> Код:
|
Похожие темы | ||||
Тема | Автор | Раздел | Ответов | Последнее сообщение |
Анимированное заполнение ячеек таблицы StringGrid разными способами | dubsteppaman | Помощь студентам | 15 | 06.04.2015 13:59 |
горизонтальное анимированное меню | johny_03 | JavaScript, Ajax | 1 | 16.11.2011 18:17 |
Как создать анимированное изображение | Nikolaj1 | Общие вопросы C/C++ | 4 | 25.03.2010 17:12 |
Анимированное изображение в Delphi | Lorden | Помощь студентам | 8 | 26.12.2009 01:56 |
b-cumulus – анимированное Облако тегов НА РАБОЧЕМ СТОЛЕ!!! | Lok_8 | Фриланс | 7 | 23.10.2009 09:20 |