Прихожая
Шаг 1: Создаем сайт
Шаг 2: Размещаем в интернет
Шаг 3: Раскручиваем сайт
Шаг 4: Зарабатываем
|
Создаем горизонтальное выпадающее меню в 3 шагаВ данном уроке мы научимся делать выпадающее меню, выполненное на связке CSS+HTML+JQuery . Как оно выглядит можете посмотреть здесь … Рассматриваемый тип выпадающего меню, легко настраивается и устанавливается на сайт. В данном меню используется JavaScript-фреймворк - JQuery , который в последнее время завоевал огромную популярность у вебмастеров. Чтобы установить и настроить внешний вид меню, Вам понадобятся лишь небольшие знания html и css . Итак давайте по-порядку: ШАГ 1: Скачать архив с нужными для правильной работы этого меню файлами(два изображения, файл стилей, и файлы javascript) , и распаковать его в корень сайта. ШАГ 2: На страницы сайта, где будет размещаться данное меню, между тегами <HEAD> и </HEAD> вставить следующий код: <link rel="stylesheet" type="text/css" href="menu/jqueryslidemenu.css" /> И непосредственно в тело документа, в то место, где будет находится само меню, вставить следующий HTML код : <div id="myslidemenu" class="jqueryslidemenu">
В качестве элементов меню выступает обычный немаркированный список. Если нужно сделать вложение, то просто внутрь одного списка, вкладывается другой.
ШАГ 3: Настроить внешний вид меню конкретно под Ваши нужды. Это делается редактированием файла стилей jqueryslidemenu.css , находящегося внутри архива, скачанного на первом шаге. И наконец, если у Вас остались вопросы, скачивайте видеоурок ниже, там я рассказываю все тонкости по установке этого меню на сайт.  Рис.1 Скриншот из видеоурока по установке выпадающего меню
 Создан: 2009-01-20 Просмотров: 45433 Автор:Андрей ГалямовКомментарии: Автор: Ольга Спасибо, Андрей, за урок. Я поздравляю Вас с таким знаменательным событием, хотя не зарекайтесь, что это Ваша последняя сессия. К сожалению, сейчас мне некогда разбираться в тонкостях создания сайта, я, вообщем-то, самоучка на компьютере, но с удовольствием займусь этой программой как только немного освобожусь.Скажите, а возможности Вашего и платного сайта совпадают? Автор: ta17 Большое спасибо,Андрей!Мне будет очень интерестно просмотреть вашу информацию!!!!! А по поводу сессии ,поздравляю,и желаю успехов в дальнейшем!!!!!Еще раз большое спасибо!!!!! С уважением Артем!!!!! Автор: Андрей Галямов Ольга . Я не совсем понял Ваш вопрос Автор: Андрей Благодарю за урок, Андрей! Постараюсь применить на практике и поздравляю от всей души с окончанием сессии!!! Автор: Dishvola Андрюха! Поздравляю с окончанием сессии! Меню бомбезно, мне очень понравилось, всё хорошо объяснил, я всё понял ))) Тёска ;) Автор: Елена Андрей, добрый день! присоединяюсь к поздравлениям и спасибо за уроки. К сожалению, я совсем не технарь,просто хочу создать свой сайт.Поэтому пока сложновато. Надеюсь поможете советами.. Наверное, когда решу, что буду размещать, обязательно сообщу, о чем хотелось бы узнать.. А Вашему сайту- успешного развития! А когда мой сайт будет готов..( не обещаю, правда, что скоро, т.к. нужно найти помощников)).. я обязательно размещу ссылку на Ваш сайт-)) Автор: Елена Здравствуйте Андрей! Поздравляю, поздравляю, поздравляю с окончанием сессии!!! Большое спасибо за уроки, мне они очень помогли! Желаю успехов в Вашем бизнесе! Автор: Наталья Здравствуйте, Андрей! Большое спасибо за урок. Я, к сожалению, сейчас на работе и времени на его изучение совсем нет. Этим я займусь вечером, когда буду дома. Поздравляю со сдачей сессии! Мне самой очень хорошо знакомы эти чувства (сама закончила два ВУЗа). А на счет последней сессии действительно не нужно зарекаться. Воможно, через какое-то время Вы решите, что Вам просто жизненно необходимо еще одно образование и тогда... снова здравствуйте учебники и бессонные ночи. Ведь, как известно, совершенству нет предела. Автор: Владимир Здравствуйте, Андрей! Поздравляю со сдачей сессии! Спасибо за урок. Постараюсь потихоньку освоить и применить на практике. Автор: Александр Поздравляю со сдачей сессии!!!!! ОГГГГГГГГГГромнОООООООе спасибо за уроки, надеюсь и в дальнейшем их получать...:)!:)!:)!:)! Автор: Alexander Большое спасибо, Андрей! Очень полезная информация, и бесценный ваш труд, и поздравляю со сдачей сессии Автор: Валерий Мои искренние поздравления с окончанием ВУЗа! Спасибо за уроки. Вы, Андрей - Человек (с большой буквы)! Автор: Сергей Андрей, поздравляю!!! Теперь Вы совсем взрослый, удачи в профессии и спасибо за урок! Автор: алексей Мои поздравления Андрюха!!!Спасибо за урок,так как я ботан в компах пока еще сложновато освоить,но буду стораться! Автор: teren Поздравляю!!!!!!! Спасибо за урок надеюсь на дальнейшее сотрудничество!!! Автор: Александр Поздравляю Вас Андрей с успешной сдачей сессии!!! Я за Вас очень рад!!! Надеюсь и в дальнейшем получать от Вас такой великолепный материал! Автор: рамзан присоединяюсь пожеланиям. пока у меня нет возможности посмотреть эти уроки, если чечтно я не знаю о чем даже. но сайт я ещё не создал пока ищу то что понравилось людям. Автор: ксюха Здравствуйте Андрей большое спасибо за полезную информацию присоединяюсь к пожеланиям и надеюсь на дальнейшую поддержку!!! Автор: Гриша Андрей, спасибо. У меня теперь тоже менюшка работает :) Все доступно, делал параллельно с вашим голосом, получилось без запинок. Жду новых уроков Автор: Лейла Дорогой Андрей, очень рада за Вас! Поздравляю с завершением определенного этапа в вашей жизни! Спасибо за радость, которую Вы доставляете нам своими уроками! Успехов Вам и всем, кто в этом сайте так же! Автор: dima большое спасибо андрюха))))) Автор: garik Андрей большое спасибо! Ты просто опостол в мире нета. Автор: Серый Андрей спасибо большое!!!!!!Ты помог мне сделать то что я хотел!!! Это сайт!!! И ещё рас спасибо!!!!!!! Автор: Серый Андрей скажите пожалуйста как создать страничку не первую например:Первая страничка там правила зарегестрироватся и войти. Когда я нажимаю у себя на страничке на кнопку войти у меня не чего не высвечивается а должно на пример вводите пароль и имя. Как сделать чтоб на первой страничке я нажал войти и у меня высветилось ведите имя и пароль. аналогично и в регестрации чтоб было . Как? Автор: Антон Андрей, спасибо огромное за эту Вашу подвижническую работу. Я сам преподаватель и вот сейчас пыхчу над сайтом для студентов, который значительно облегчит им обучение. Приходится информацию собирать буквально по крохам, а для меня - чайника в веб-конструировании - это совсем непросто. Хочу Вам сказать, что у Вас талант объяснять достаточно сложные вещи простым и понятным языком. Не прекращайте своей работы. Она очень нужна. С уважением, А. Шупенин. Автор: vicinn Андрей спасибо Автор: serg хорошо когда есть толковые люди и могут обьяснить чо к чему . благодарю за легкий рассказ. Автор: Вадим Спасибо Андрей за Ваши уроки! Все написано очень доходчиво и на понятном языке. Благодаря Вам, я научился многому, так как приходится корректировать и дополнять рабочий сайт. Раньше я вообще в этом ничего не понимал, но сейчас уже планирую полностью переделать рабочий сайт. Спасибо Вам огромное! Автор: Nina Спасибо! что-то "горизонтально" не получилось... Вертикальный список компонент Автор: Андрей Урок классный! Но у меня возник вопрос :я всё сделал, куда нужно вставил код и меню появилось но подменю нет и стрелочик нет. Автор: Андрей Галямов Значит что-то сделали не так. Делайте более внимательно, и все у Вас получиться Автор: Андрей А чем это может быть вызвано? Автор: Nina Большое спасибо, Андрей! После просмотра видеоурока все получилось КЛАССНО! Супер! Автор: Alex Все замечательно, только почему все файлы при распаковке выдают ошибку CRC? Автор: Alex иполучаются обыкновенные вложенные маркированные списки ссылок - совсем не так как на картинке... Автор: ЛЮБОВЬ Андрей! Очень хорошо все описано от содания сайта и далее .Вы единственный кто очень хорошо и понятно излагает материал.Теперь я буду руководствоваться только вашим сайтом.Спасибо вам Автор: alkor СУПЕР Автор: Дмитрий подскажите пож-та где я могу задать цвет фона меню, как поменять size и разместить в верхнем правом углу?? чёт никак не соображу. =) Заранее благодарен за ответ Автор: Дмитрий разобрался во всём , вот только не найду как переместить менюшку в угол =( помогите пож-та Автор: Gex В опере не появляются стрелки и подменю? В IE всё впорядке. Автор: Viktor хороший скрипт но как обычьно не без проблем опера в самом деле не коректно работает в старых браузерах действительно есть продлемы описаные выше, а связаны они с CSS документом в нём нужно либо совсем удолить коментарии или же добавить **** Пример:/*Коминтарий******************/ Автор: dorsen С вертикальным меню понятно, а как сделать горизонтальное? Автор: Рамиль Самый лучший сайт Автор: xJlaIIax У меня всё получилось кроме одного.Меню приклеилось в плотную к левой стороне сайта.Как его расположить по центру? Автор: Андрей Галямов Вопросы на форум. Автор: Санечка Андрей! ваш урок просто замечательный, но у меня есть вопрос: я сделала меню не горизонтальное, а вертикальное и мне надо чтобы подменю появлялось не внизу, а сбоку от главного меню, подскажите пожалуйста, что нужно для этого сделать . Автор: Санечка вопросов больше нет, я нашла у вас, все что мне нужно =) Автор: Алексей Все отлично! не понятен один момент: в файле *jqueryslidemenu.css* есть Хак специально для IE6, чтобы достичь корректного отображения. У меня под словом корректного получается просто список вместо меню, подскажите, что не так? Автор: Евгений Алексей, удали все комментарии с файла jqueryslidemenu.css и в IE6 будет отображаться корректно. Автор: Саша Огромное спасибо за урок!!! Андрей у меня есть вопрос: Можно ли іместо зеленого фона подставить свою картинку??? Тоесть там где "обучение" поставить свою картинку??? Напишите пожалуйста как это сделать. Мне это очень нужно!!! Заранее огромное спасибо!!! Автор: Cаша Андрей, ответьте мне пожалуйста , вы меня очень выручите , мне действительно это нужно , скажите: Можно ли вместо зеленого фона подставить свою картинку??? Тоесть там где "обучение" поставить свою картинку??? Напишите пожалуйста как это сделать. Заранее спасибо!!! И еще можно ваш ICQ??? Автор: Аркадий Поздравляю вас Андрей!!! Спасибо за урок!!! Подскажите люди добрые , а как можно убрать стрелочки эти которые показывают вверх и вниз. Они не очень смотрятся!!! Заранее большое спасибо! Автор: Николай Язвенко Я установил горизонтальное и вертикальное меню, но при раскрытии горизонтального меню, подменю почему-то начинает мерцать. А на страничке, где вертикальное меню, горизонтальное вообще глючит (http://electricspace.ru/index.php?option=com_content&task=view&id=44&Itemid=84) Автор: Сергей У вас ошибка где графа надо убрать пробел в начале < li><a href="#">Уроки</a></li> Автор: Толик подскажи как выровнять меню по правому краю Автор: Толик Ненада разобрался Автор: Толик подскажите где уменьшается ширина меню? очень нада Автор: Олег Добрый день. Подскажите пожалуйста. Вставил ваше меню - всё отлично! Только одно но. В IE Работает, а в Mozilla нет...просто его даже не отображает... Подскажите почему? Автор: Артем Подскажите пожалуйста! Я в сайт с блочной версткой вставил это меню, в content. В редакторе html все выглядит красиво, а в браузере оно растягивается. Что делать? Автор: lerich23 Код указанный вами на этой странице не работает в браузере IE6 Автор: Славик Подскажите, как сделать разный цвет текста у главного меню и выпадающего Спасибо! Автор: Саша у меня ваще не работает почему то((( Автор: Мурат Друг спасибо те я оч давно искал нормальный урок спсибо за о что так доступно обьяснил) Автор: Alexander Подскажите пожалуйста! Например я создал ссылку (в html) на файл readme.txt как сделать так чтоб вместо диалогового меню браузера (сохранить как...и т.д.) файл просто откривался? Автор: Pilot Спасибо большое Андрей урок очень помог. Добавить комментарий: |
Поиск по сайту
|
