Не нравятся результаты поиска? Попробуйте другой поиск!
DLE FAQ » Все вопросы » Стили (CSS) » Как адаптивно вывести блок под кнопку?

Как адаптивно вывести блок под кнопку?


     25.10.2017    адаптивность, css, jquery    Стили (CSS), jQuery    1230

вопрос
Здравствуйте.
Есть блок слева, sidebar, который занимает 3 колонки. Справа основной content на 9 колонок.
При ширине экрана 768px в sidebar должна поменяться "обвязка", content на 12 колонок и кнопка, которая, при клике покажет новый sidebar.
Как адаптивно вывести блок под кнопку?

Как адаптивно вывести блок под кнопку?

Как адаптивно вывести блок под кнопку?


Использовал я примерно такие строки:
var $win = $(window);
var $doc = $(document);

$win.on('load resize', function() {
   var $content = $('.sidebar').html(); // Контент sidebar
   var $pushy = $('.pushy-content'); // Блок под кнопкой
   if ($win.width() <= 768) {
       if ($pushy.html().length < 1) {
           $pushy.append($content); // Подкидаем html под кнопку из блока sidebar
       }
   } else {
       $pushy.html('');
   }
});


Но при вырезании из потока перестают работать плагины. Их приходиться обновлять методами и удалять отрендеренный html плагинов.

Пример

Вопрос:
Как правильно организовать такой адаптив, чтобы было надежно и масштабируемо?

Ответа пока нет


1 комментарий

BRAGA
Юзер

BRAGA - 25 октября 2017 18:32 -

HTML

Чтобы комментировать - войдите или зарегистрируйтесь на сайте

Похожие вопросы

наверх