Подскажите пожалуйста как сделать меню

Автор Тема: Подскажите пожалуйста как сделать меню  (Прочитано 1145 раз)

Оффлайн alik2039Автор темы

  • Бизнес оценка: (0)
  • Рекрут
  • *
  • СПАСИБО: 2
  • Сообщений: 23
  • Карма: 0
  • Пол: Мужской
    • Просмотр профиля
    • Как настроить?

Оффлайн alik2039Автор темы

  • Рекрут
  • *
Уважаемые форумчане подскажите пожалуйста, как можно сделать меню с раздвижными вниз подкатегориями DLE 10.2
https://kaknastroit.com/


Оффлайн wassulmaier

  • Бизнес оценка: (0)
  • Постоялец
  • ***
  • СПАСИБО: 74
  • Сообщений: 238
  • Карма: 13
  • Пол: Мужской
    • Просмотр профиля
    • Мои сайты

Оффлайн wassulmaier

  • Постоялец
  • ***
Уважаемые форумчане подскажите пожалуйста, как можно сделать меню с раздвижными вниз подкатегориями DLE 10.2

Привыкай брат к тому, что если хочешь, чтобы кто-то копался в твоем дерьме, за это нужно заплатить. Ну а так, кое что я подскажу тебе бесплатно.

1) Создай блок, где будет выводится все элементы меню.
2) С помощью CSS сделать блок невидимым, типы display:none, visibility:invisible
3) С помощью СSS сделать следующее - если на элемент меню ты наводишь курсор, то должен плавно открываться блок с элементами меню. Если нужно сделать, чтобы блок с элементами меню открывался по клику на кнопку, то тут тебе в помощь JS. Это самые простенькие скрипты.

Кстати кружочки - может сделать как img стоящие перед элементами меню.

И рекомендую на ночь не кодить. Иначе хрен уснешь.

Дерзай, салага  :)
Развлекательный сайт- http://www.officeplankton.com.ua.

Оффлайн alik2039Автор темы

  • Бизнес оценка: (0)
  • Рекрут
  • *
  • СПАСИБО: 2
  • Сообщений: 23
  • Карма: 0
  • Пол: Мужской
    • Просмотр профиля
    • Как настроить?

Оффлайн alik2039Автор темы

  • Рекрут
  • *
Привыкай брат к тому, что если хочешь, чтобы кто-то копался в твоем дерьме, за это нужно заплатить. Ну а так, кое что я подскажу тебе бесплатно.

1) Создай блок, где будет выводится все элементы меню.
2) С помощью CSS сделать блок невидимым, типы display:none, visibility:invisible
3) С помощью СSS сделать следующее - если на элемент меню ты наводишь курсор, то должен плавно открываться блок с элементами меню. Если нужно сделать, чтобы блок с элементами меню открывался по клику на кнопку, то тут тебе в помощь JS. Это самые простенькие скрипты.

Кстати кружочки - может сделать как img стоящие перед элементами меню.

И рекомендую на ночь не кодить. Иначе хрен уснешь.

Дерзай, салага  :)

Сколько это будет стоить
https://kaknastroit.com/

Оффлайн Sorokin Vladimir

  • Бизнес оценка: (0)
  • Старожил
  • ****
  • СПАСИБО: 92
  • Сообщений: 417
  • Карма: 8
  • Пол: Мужской
  • Учиться никогда не поздно!
    • Просмотр профиля
    • Сделай сам

Оффлайн Sorokin Vladimir

  • Старожил
  • ****
  • Доп. информация
    • Бизнес оценка: (0)
    • СПАСИБО: 92
    • Сообщений: 417
    • Карма: 8
    • Пол: Мужской
    • Учиться никогда не поздно!
      • Просмотр профиля
      • Сделай сам
Уважаемые форумчане подскажите пожалуйста, как можно сделать меню с раздвижными вниз подкатегориями DLE 10.2

   А «погуглить» тему про выпадающие меню – слабо!?
Мой девиз:    Делу время, потехе – час!

Оффлайн alik2039Автор темы

  • Бизнес оценка: (0)
  • Рекрут
  • *
  • СПАСИБО: 2
  • Сообщений: 23
  • Карма: 0
  • Пол: Мужской
    • Просмотр профиля
    • Как настроить?

Оффлайн alik2039Автор темы

  • Рекрут
  • *
   А «погуглить» тему про выпадающие меню – слабо!?

нет не слабо, я погуглил но получается ерунда
https://kaknastroit.com/


Оффлайн Sorokin Vladimir

  • Бизнес оценка: (0)
  • Старожил
  • ****
  • СПАСИБО: 92
  • Сообщений: 417
  • Карма: 8
  • Пол: Мужской
  • Учиться никогда не поздно!
    • Просмотр профиля
    • Сделай сам

Оффлайн Sorokin Vladimir

  • Старожил
  • ****
  • Доп. информация
    • Бизнес оценка: (0)
    • СПАСИБО: 92
    • Сообщений: 417
    • Карма: 8
    • Пол: Мужской
    • Учиться никогда не поздно!
      • Просмотр профиля
      • Сделай сам
нет не слабо, я погуглил но получается ерунда
а подробней?
Мой девиз:    Делу время, потехе – час!

Оффлайн alik2039Автор темы

  • Бизнес оценка: (0)
  • Рекрут
  • *
  • СПАСИБО: 2
  • Сообщений: 23
  • Карма: 0
  • Пол: Мужской
    • Просмотр профиля
    • Как настроить?

Оффлайн alik2039Автор темы

  • Рекрут
  • *
   А «погуглить» тему про выпадающие меню – слабо!?
Вот нашел именно то, что мне надо, но не получается его перенастроить под свой шаблон.

Как уже можно было догадаться из названия, для реализации подобного меню у себя на сайте Вам понадобится библиотека jQuery. Если данная библиотека на Вашем сайте еще не была подключена ранее, то следует это сделать следующим образом:
<script type="text/javascript"
src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
Дальше необходимо прописать CSS стиль для нашего меню. Чтобы оно выглядело точно так же как и в примере, приведенном выше, используйте следующее оформление:
<style type="text/css">
ul#menu, ul#menu ul {
  list-style-type:none;
  margin: 0px;
  padding: 0px;
  width: 250px;
}

ul#menu a,ul#menu span { display: block; text-decoration: none; }

ul#menu li { margin-top: 1px; }

ul#menu li a,ul#menu li span {
  background: #333333;
  color: #FFFFFF;
  padding: 7px;
}

ul#menu li a:hover,ul#menu li span:hover { background: #000000; }

ul#menu li ul li a {
  background: #CCCCCC;
  color: #000000;
  padding-left: 20px;
}

ul#menu li ul li a:hover {
  background: #AAAAAA;
  border-left: 5px #000000 solid;
  padding-left: 15px;
}
</style>
Меню, которое будет раздвигаться и сдвигаться при клике по его пунктам, следует прописать следующим образом:
<ul id="menu">
 <li><span>Скрипты</span>
    <ul>
     <li><a href="log_info.php">Скрипт записи логов</a></li>
     <li><a href="current_time.php">Текущая дата и время</a></li>
     <li><a href="slide_show_jquery.php">Слайдшоу на jQuery</a></li>
     <li><a href="scroll_to_top.php">Кнопка вверх</a></li>
    </ul>
 </li>
 <li><span>Онлайн сервисы</span>
    <ul>
        <li><a href="csscompressor.php">Сжатие CSS кода онлайн</a></li>
        <li><a href="javascriptcompressor.php">Сжатие JavaScript кода</a></li>
        <li><a href="opennet.php">Калькулятор диапазонов IP</a></li>
        <li><a href="qrcoder.php">Онлайн генератор QR кодов</a></li>
        <li><a href="gtmetrix.php">Анализ скорости сайта</a></li>
    </ul>
 </li>
 <li><a href="">Поддержка</a></li>
 <li><a href="">Форум</a></li>
 <li><span>Хитрости</span>
    <ul>
        <li><a href="csssprites.php">Использование CSS спрайтов</a></li>
        <li><a href="rgb_cod_color.php">HEX и RGB коды цветов</a></li>
        <li><a href="no_www.php">Убрать www из адреса сайта</a></li>
    </ul>
 </li>
</ul>
Теперь остается лишь где-нибудь в конце странички добавить наш JavaScript код, который будет отвечать за сворачивание и разворачивание меню (его подпунктов). Для этого скопируйте себе данный JavaScript код:
<script type="text/javascript">
$(document).ready(function() {
$("#menu ul").hide();
$("#menu li span").click(function() {
    $("#menu ul:visible").slideUp("normal");
    if (($(this).next().is("ul")) && (!$(this).next().is(":visible"))) {
        $(this).next().slideDown("normal");
    }
});
});
</script>

Помогите адаптировать это меню под мой сайт, не получается изменить размер шрифта, ну и чтобы вписывалось в мой сайт. Заранее спасибо.

Добавлено: 30-11-2017, 12:01:41

а подробней?
Хочется, что бы под категории основных категорий (компьютер, операционная система, смартфоны и телефоны) открывались нажав на них
« Последнее редактирование: 30-11-2017, 12:01:41 от alik2039 »
https://kaknastroit.com/

Оффлайн Sorokin Vladimir

  • Бизнес оценка: (0)
  • Старожил
  • ****
  • СПАСИБО: 92
  • Сообщений: 417
  • Карма: 8
  • Пол: Мужской
  • Учиться никогда не поздно!
    • Просмотр профиля
    • Сделай сам

Оффлайн Sorokin Vladimir

  • Старожил
  • ****
  • Доп. информация
    • Бизнес оценка: (0)
    • СПАСИБО: 92
    • Сообщений: 417
    • Карма: 8
    • Пол: Мужской
    • Учиться никогда не поздно!
      • Просмотр профиля
      • Сделай сам
давайте  сделаем по другому, напишите куда мне скинуть архивчик с подборкой менюшек, которые я много раз вставлял в свои шаблоны -  посмотрите они все очень просы в настройках стилей (цвет, шрифт и тд), потому что залазить в код вашего сайта (я так понял он на DLE) это последнее дело.
Мой девиз:    Делу время, потехе – час!

Оффлайн alik2039Автор темы

  • Бизнес оценка: (0)
  • Рекрут
  • *
  • СПАСИБО: 2
  • Сообщений: 23
  • Карма: 0
  • Пол: Мужской
    • Просмотр профиля
    • Как настроить?

Оффлайн alik2039Автор темы

  • Рекрут
  • *
давайте  сделаем по другому, напишите куда мне скинуть архивчик с подборкой менюшек, которые я много раз вставлял в свои шаблоны -  посмотрите они все очень просы в настройках стилей (цвет, шрифт и тд), потому что залазить в код вашего сайта (я так понял он на DLE) это последнее дело.
Вот мой адрес alik2039@yandex.ru, буду вам при много благодарен. Огромное спасибо, Буду ждать. Спасибо
https://kaknastroit.com/


Оффлайн Sorokin Vladimir

  • Бизнес оценка: (0)
  • Старожил
  • ****
  • СПАСИБО: 92
  • Сообщений: 417
  • Карма: 8
  • Пол: Мужской
  • Учиться никогда не поздно!
    • Просмотр профиля
    • Сделай сам

Оффлайн Sorokin Vladimir

  • Старожил
  • ****
  • Доп. информация
    • Бизнес оценка: (0)
    • СПАСИБО: 92
    • Сообщений: 417
    • Карма: 8
    • Пол: Мужской
    • Учиться никогда не поздно!
      • Просмотр профиля
      • Сделай сам
отправил - дерзайте!
Мой девиз:    Делу время, потехе – час!


 

Похожие темы

  Тема / Автор Ответов Последний ответ
3 Ответов
1174 Просмотров
Последний ответ 06-01-2012, 01:30:54
от Гарик+
12 Ответов
3324 Просмотров
Последний ответ 05-09-2013, 12:07:54
от spainandrussia
2 Ответов
3598 Просмотров
Последний ответ 28-06-2014, 18:35:13
от Carte-de-France
3 Ответов
870 Просмотров
Последний ответ 25-08-2016, 21:58:06
от surfer
0 Ответов
486 Просмотров
Последний ответ 07-09-2016, 17:18:08
от wassulmaier