Как сделать, чтобы выезжающий поиск сдвигал меню и логотип?
В общем, есть стандратное меню и справа блок с поиском, который по нажатию становится шире.
Нужно, чтобы при открытии он сдвигал влево весь контент.
Есть масса примеров, вроде мобильных меню, которые по клику сдвигают body или html элементы на странице за пределы экрана. Необходимо такой эффект сделать только для одного блока в шапке.
Подключать массивные библиотеки смысла нет.
В какую сторону смотреть, чтобы сделать это?
Набросал черновой вариант того, что примерно есть jsfiddle.net/AkeXL
Единственное к чему я склоняюсь это overflow: hidden для родителя и сдвигать меню и лого по клику на поиск и возвращать обратно при потере фокуса.
Могут быть какие-либо проблемы из-за этого?
Ты псих.
Но почитай про позиционирование.
К примеру если не нажата кнопка, то left:0;
Если активна , то left:100px;
блок который смещается position:fixed. У родителя position:relative;
А если хочешь что бы весь контент смешался, то надо сделать с ним тоже самое.
Если ты сасс знаешь, то ты понял о чем я.
А если не хочешь думать, то вот тебе зло. Там не много надо изменить и убрать весь js. Он там не нужен.
@iiil Я знаю что готовое решение зло, но почему бы и нет.
Зачем придумывать велосипед, если он уже придуман? Тут тоже самое, а все ост. пускай сам уже.
Простой
