Форум Сайтостроение Веб-строительство

Меню на сайте

ET
На сайте с 26.02.2018
Offline
25
EXNT
439

Доброй ночи.

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

Сейчас меню выглядит таким образом.

Необходимо что бы при нажатии на ссылку открывалось подменю :)

Вот код 

<div class="topmenu">

		<div class="menu-line"><a href="/" class="topmenu-link"><img src="{THEME}/images/home-p.png" alt="home-p" /></a></div>

		<div class="menu-line"><a href="#" class="topmenu-link">iPhone</a></div>

		<div class="menu-line"><a href="#" class="topmenu-link">iPad</a></div>

		<div class="menu-line"><a href="#" class="topmenu-link">iPod</a></div>

		<div class="menu-line"><a href="#" class="topmenu-link">iMac</a></div>

		<div class="menu-line"><a href="#" class="topmenu-link">Mac Book</a></div>

		<div class="menu-line"><a href="#" class="topmenu-link">Apple watch</a></div>

		<div class="menu-line"><a href="#" class="topmenu-link">Контакты</a></div>

		<div style="clear:both;"></div>
Проверь любую организацию. Бесплатно (https://rusprofile.ru/)
D.iK.iJ
На сайте с 26.05.2013
Offline
229
D.iK.iJ
#1

Ну так добавляете субменю как-то так:

<div class="menu-line">

<a href="#" class="topmenu-link">iPhone</a>

<div class="submenu">Субменю</div>

</div>

Ну и показываете его при наведении на ячейку: 

.submenu {display: none;}

.menu-line:hover .submenu {display: block;}

Обычно еще для .submenu прописывают позиционирование вроде position: absolute; z-index: 99;

Куда можно добавить top, left, right..

Адаптивный дизайн в 2 строчки ( https://dikij.com/wm/adaptaciya-saytov.php ). + Принимаю заказы любой сложности ( https://searchengines.guru/ru/forum/926323 ). 💎 Еще я делаю классные кулоны с опалами ( https://mosaicopal.ru/ ).
S
На сайте с 30.09.2016
Offline
469
Sitealert
#2

Я привык к вложенным элементам

<ul class="topmenu">
  <li><a href="#">iPhones1</a></li>
  <li><a href="#">iPhones2</a></li>
    <ul class="submenu">
      <li><a href="#">iPhone1</a></li>
      <li><a href="#">iPhone2</a></li>
    </ul>
  </li>
</ul>
Отпилю лишнее, прикручу нужное, выправлю кривое. Вытравлю вредителей.

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий