Перейти из форума на сайт.

Новости • Файловые архивы
Поиск • Активные темы • Топ лист
Правила • Кто в on-line?
Вход • Забыли пароль? • Первый раз на этом сайте? • Регистрация
Компьютерный форум Ru.Board » Интернет » В помощь вебмастеру » Меню для сайта

Модерирует : Cheery

 Версия для печати • Подписаться • Добавить в закладки

Открыть новую тему     Написать ответ в эту тему

Manymoney

Junior Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
про различные меню для сайтов, на различных языках.. (одно- и многоуровневые, раскрывающиеся и всплывающие, и тд. и тп.)
плюсы и минусы
 
 
 
Добавлено:
мне так лично нужно такое - Выпадающее меню (пример - https://www.dynadot.com , что справа наверху, со стрелкой (первое что попалось, такие счас на каждом втором, начиная с гугла - выбор Языка / Страны / опции). Требования:
- раскрывается по нажатию;
- сворачиваться по нажатию там же, или же по клику в любом месте;
- неплохо бы возможность ставить рядом также кликабельную иконку
- желателен выбор варианта - раскрывать вниз или же вбок.
 
..хотя вроде и простой, и "на каждом втором", но - найти код для такого, копаясь в гуглах, не удалось.. о.О  надоело перебирать десятки всякой "не той" ерунды. может кто в курсе и подскажет где взять код такого
зы: правда насколько понял - иметь такое только на CSS3/5 - нельзя, только +какой-нить JS. возможно так и есть..
 
..советы типа: "обычный js-скрипт. смотрим в исходник страницы и копируем" не катят/ нечего там "брать"
Всего записей: 52 | Зарегистр. 05-06-2007 | Отправлено: 17:46 09-06-2017
Mavrikii

Platinum Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Manymoney
есть же тема, хоть и древняя - Скрипты выпадающих меню (DHTML menu, sliding menu)

Цитата:
найти код для такого, копаясь в гуглах, не удалось.

https://v4-alpha.getbootstrap.com/components/dropdowns/
Всего записей: 15117 | Зарегистр. 20-09-2014 | Отправлено: 17:51 09-06-2017 | Исправлено: Mavrikii, 17:59 09-06-2017
Manymoney

Junior Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
нуу.. в такие дебри не залезал.. (2004-10гг.)
ну и там есть ссылок на некие общие ресурсы (англ.) по вопросу, но ничего такого конкретного/
 
зы: напишите хоть по какой технологии оно сделано (я не программист ниразу, только обще), чтоб знать хоть что-где копать
Всего записей: 52 | Зарегистр. 05-06-2007 | Отправлено: 17:54 09-06-2017 | Исправлено: Manymoney, 18:01 09-06-2017
Mavrikii

Platinum Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Manymoney

Цитата:
в такие дебри не залезал.. (2004й год)  

последний пост 2010, пара страниц, так что нужно ее продолжать, а не создавать новую

Цитата:
зы: напишите хоть по какой технологии оно сделано

https://v4-alpha.getbootstrap.com/components/dropdowns/
Всего записей: 15117 | Зарегистр. 20-09-2014 | Отправлено: 18:00 09-06-2017 | Исправлено: Mavrikii, 18:00 09-06-2017
Manymoney

Junior Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
:снкс: На русском подобные ресурсы есть? (оно как бы да, но всё же..)
Всего записей: 52 | Зарегистр. 05-06-2007 | Отправлено: 18:03 09-06-2017
Mavrikii

Platinum Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Manymoney

Цитата:
На русском подобные ресурсы есть?

http://bfy.tw/CHJH
Всего записей: 15117 | Зарегистр. 20-09-2014 | Отправлено: 18:05 09-06-2017
Manymoney

Junior Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
ага. Bootstrap (dropdown JavaScript plugin)...
 вроде как есть рабочие примеры и в русском, и в Dropdowns. будем посмотреть
Всего записей: 52 | Зарегистр. 05-06-2007 | Отправлено: 03:04 10-06-2017 | Исправлено: Manymoney, 17:29 10-06-2017
Kaber



Advanced Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Manymoney
А что мешает скопировать меню прям с https://www.dynadot.com
Всего записей: 1356 | Зарегистр. 14-03-2014 | Отправлено: 07:24 10-06-2017
Manymoney

Junior Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
сохранял, копировал /то, что посчитал относящимся к/, вставлял - ничего не вышло (чтобы понимать что брать-копировать-кудачеговставлять надо хоть немножко знать на какой базе это сделано/работает)  :ниасилил:
 
..единственно что во всём этом удивляет - такая ходовая вещь, а готового кода найти не удалось.. (хотя сотни всякого по сети рассыпаны)
 

Добавлено:
хм. Сделал всё по указаниям
- [Скачать bootstrap-3.3.7]
- заливаем папки [css] [fonts] и [js] в корень сайта
- добавляем в index.html :  
в  <head>

Код:
  <head>
   ....  
  <link href="css/bootstrap.min.css" rel="stylesheet">
  </head>

 в <body>

Код:
<body>
    ............
    <script src="http://code.jquery.com/jquery-latest.js"></script>
    <script src="js/bootstrap.min.js"></script>
  </body>
 


Код:
... И все настроено! Добавив эти два файла, вы можете с помощью Bootstrap разрабатывать сайт или приложение.

- добавляем в <body> код кнопки из примеров.
...никакого действия.. (а добавление bootstrap.min.css так еще и отменяет локальный css/)
то есть не всё так просто. надо разбираться далее
Всего записей: 52 | Зарегистр. 05-06-2007 | Отправлено: 14:07 10-06-2017 | Исправлено: Manymoney, 17:27 10-06-2017
Mavrikii

Platinum Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Manymoney
ссылку дайте и посмотрим. либо смотрите консоль браузера на наличие сообщение об ошибках
Всего записей: 15117 | Зарегистр. 20-09-2014 | Отправлено: 20:45 10-06-2017
Manymoney

Junior Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
какая "консоль"... Тупо кнопка висит (если подключена bootstrap.min.css) со стрелкой, и не реагирует..
 
Если "Исследовать элемент" в ФФ, то пожалуйста:

Код:
 
<div class="btn-group">
  <a class="btn dropdown-toggle" Переключение="" данных="dropdown" href="#">
    Кнопка
    <span class="caret"></span>
  </a>
  <ul class="dropdown-menu">
    <!-- dropdown menu links -->
  <li><a href="http://www.html">1.</a></li>
  <li><a href="#">2.</a></li>
  <li><a href="#">3.</a></li>
</ul>
</div>
 
Всего записей: 52 | Зарегистр. 05-06-2007 | Отправлено: 05:17 11-06-2017 | Исправлено: Manymoney, 05:19 11-06-2017
Mavrikii

Platinum Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Manymoney

Цитата:
какая "консоль"

то, что относится к "исследовать элемент". там же есть закладка Консоль, в которую выводятся ошибки страницы или загрузки элементов.
Всего записей: 15117 | Зарегистр. 20-09-2014 | Отправлено: 19:20 11-06-2017
Manymoney

Junior Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
а, да, в "Исследовать элемент" есть вкладка Console , но там пусто (при любых воздействиях на кнопку)
 
Всего записей: 52 | Зарегистр. 05-06-2007 | Отправлено: 01:31 12-06-2017 | Исправлено: Manymoney, 02:21 13-06-2017
Mavrikii

Platinum Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Manymoney

Цитата:
то можно увидеть

это не то
 

Цитата:
Переключение="" данных="dropdown"

эм, это что такое ?))
 
держите
https://jsfiddle.net/39ksus9p/
Всего записей: 15117 | Зарегистр. 20-09-2014 | Отправлено: 11:01 12-06-2017
Manymoney

Junior Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
ага. да, работает.
что-то поправили
ибо отличие от того 'каноничъного' примера с "солидного сайта"

Код:
 
<div class="btn-group">
  <a class="btn dropdown-toggle" Переключение данных="dropdown" href="#">Кнопка
    <span class="caret"></span>  </a>
<ul class="dropdown-menu">  
  <li><a href="#1">1.</a></li>  
  <li><a href="#2">2.</a></li>  
  <li><a href="#3">3.</a></li>  
</ul>  
</div>
 

здесь -  

Код:
<div class="btn-group">  
  <button class="btn btn-primary dropdown-toggle" id="menu1" type="button" data-toggle="dropdown">Кнопка
    <span class="caret"></span></button>
 <ul class="dropdown-menu">  
  <li><a href="#1">1.</a></li>  
  <li><a href="#2">2.</a></li>  
  <li><a href="#3">3.</a></li>  
</ul>  
</div>  
- отличия - видим налицо
 
теперь надо допиливать стиль под свои нужды.... (что тоже стопудов составит проблемы, ибо "добавление bootstrap.min.css" - "отменяет наличный css")
Всего записей: 52 | Зарегистр. 05-06-2007 | Отправлено: 23:22 12-06-2017 | Исправлено: Manymoney, 23:23 12-06-2017
Mavrikii

Platinum Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Manymoney

Цитата:
'каноничъного' примера

в нем явный бред, выраженный в
Цитата:
Переключение данных="dropdown"

 
в оригинале указано так, как я и сделал - https://v4-alpha.getbootstrap.com/components/dropdowns/
можно через a, а можно через button - роли не играет
Всего записей: 15117 | Зарегистр. 20-09-2014 | Отправлено: 23:27 12-06-2017
Manymoney

Junior Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
ну хз. Взял как есть, с mybootstrap.ru ("Компоненты" -> "Выпадающие списки кнопок")
 
а вот с оформлением пока что не очень-то хорошо... (нужна-то просто кнопка (пусть и волшебная), а не смена оформления всей страницы. а это всё дело работает только с bootstrap.css)
Всего записей: 52 | Зарегистр. 05-06-2007 | Отправлено: 19:13 13-06-2017
Kaber



Advanced Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Как понять какую библиотеку использует yandex market, у них получилось меню категорий наподобие Amazon:
   
И довольно все не плохо работает, по крайней мере лучше чем хотя автору большой респект за его труд
 
Добавлено:
Т.е. когда веду мышь по области А, то активная li не перескакивает на соседние, а остается "Авто". Если немного подержать курсор на соседней li то произойдет переход.
Всего записей: 1356 | Зарегистр. 14-03-2014 | Отправлено: 13:23 11-05-2020
Mavrikii

Platinum Member		Редактировать | Профиль | Сообщение | Цитировать | Сообщить модератору
Kaber
яндекс может без проблем и свое написать, им нет нужды использовать чью то библиотеку.
ps: в реализации задержки, если меню не основано на чистом CSS, нет никакой проблемы.
Всего записей: 15117 | Зарегистр. 20-09-2014 | Отправлено: 22:44 11-05-2020 | Исправлено: Mavrikii, 23:40 11-05-2020
Открыть новую тему     Написать ответ в эту тему

Компьютерный форум Ru.Board » Интернет » В помощь вебмастеру » Меню для сайта


Реклама на форуме Ru.Board.

Powered by Ikonboard "v2.1.7b" © 2000 Ikonboard.com
Modified by Ru.B0ard
© Ru.B0ard 2000-2024

BitCoin: 1NGG1chHtUvrtEqjeerQCKDMUi6S6CG4iC

Рейтинг.ru