Показать сообщение отдельно
  #2 (permalink)  
Старый 29.11.2017, 11:43
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,105

перенос пунктов меню
serhio11,
<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  </style>

  <script>
window.addEventListener("DOMContentLoaded", function() {
    var sidebar = document.querySelector(".sidebar ul.menu"),
        header = document.querySelector(".header ul.menu"),
        li = sidebar.querySelectorAll("li");

    function resizeMenu() {
        var parent = screen.width <= 768 ? header : sidebar;
        [].forEach.call(li, function(el) {
            parent.appendChild(el)
        })
    }
    resizeMenu();
    window.addEventListener("resize", resizeMenu, false)
}, false);
  </script>
</head>

<body>
<div class="header">
  <ul class="menu">
    <li><a href="#">Пункт 1</a></li>
    <li><a href="#">Пункт 1</a></li>
    <li><a href="#">Пункт 2</a></li>
  </ul>
</div>

<div class="sidebar">
  <ul class="menu">
    <li><a href="#">Пункт 1</a></li>
    <li><a href="#">Пункт 1</a></li>
    <li><a href="#">Пункт 2</a></li>
  </ul>
</div>


</body>
</html>
Ответить с цитированием