я так уже за год, вырос с твоих уроков, но начинал с них.)) как вырос, смотрю иногда, чтоб что-то вспомнить, ну и лайк поставить за труды. спасибо! если позволишь, поделюсь своим не большим опытом.)))) 1) лучше классы добавлять на li а не на ссылку! это важно, ибо в большинстве CMS, при натяжке такой верстке, проклянут, просто там на li класс можно прописать при инициализации меню к примеру в вордпресс, это гипер важно и будет попа боль... может кому пригодиться во классы вордпресса по умолчанию: nav-menu - этот класс ставиться на ul , menu-item - это класс пункта меню (li), 2) я бы вместо span сделал button причем с текстом внутри, только тексту задал бы нулевой размер, это поможет людям с инвалидностью, да и так верно по семантике, у нас там не декоративная стрелочка, а все-же это позиционируется как кнопка. но это не обязательно, можно так и не делать.)) 3) кнопка бургера, это тоже кнопка а не блок! да, это не критично и плевать как делать, но корректно, когда кнопка, это все-же кнопка а не что-то другое. опять же, проблема будет у людей с инвалидностью. 4) не помешало бы честь тот факт, что клиент в будущем может добавить новый пункт меню, и наша верстка полетит в тар тарары.... я тоже сейчас сел себе писать подобное, для проектов, и вот как раз это одна из причин, по которой решил написать адаптивное меню.))) 5) я бы шапку не делал фиксированной с самого начала, не всегда оно уместно. как по мне, лучше сделать ее фиксированной после прокрутки к примеру 200-300px. это добавит адаптивности. 6) это уже мелочи, но лучше все обернуть сначала в - "window.addEventListener("DOMContentLoaded", () =>{}", как миним поможет людям с инвалидностью. есть еще пара мелких моментов, которые тоже часто могут вызвать боль в очень больших проектах, но не критично.))) к пример, лучше проверить сразу, а создалось ли меню и наши основные классы. потому что не мы будем создавать меню а php к примеру, он баганул и наш js пошел гулять ошибками по консоле.)))
@@ИльназГарайшин-ч6о ну бывает такое, что есть вещи, которые загружаются асинхронно, или строятся js кодом, в таком случает твоя логика поиска элементов через querySelector-ы будет работать неправильно, так как страница загрузиться, начнется работа условно твоего скрипта, он не сможет найти какой нибудь условный селектор типа body.main, потому что класс main навешивается скриптом другого js, который отрабатывает после твоего, и следовательно document.querySelector('body.main') будет null, ну а ты же для чего то делал этот поиск, чтобы для чего то использовать, следовательно логика твоей программы будет рушится.
У Жени скоро 200 тыс. подписчиков, а я до сих пор читаю поздравления с первой сотней) Удачи тебе, Женя, спасибо за твои классные уроки, если чего-то не пойму или не хватит мотивации, стану твоим патроном. Для меня ты единственный человек, которому хочется задонатить, тем более это заслуженно. К концу года наберешь 500 тыс?)) Вопрос к тем, кто ставит дизлайки на видео... Ребята, за что? Человек старается, делает всё ради нас, получает с канала копейки (по меркам больших каналов). Он мог бы и кривлять рожи на видео и грести бабло, но он ставит моральные ценности выше денег. Он делится бесценным опытом, который вы не купите даже в Скиллбоксах и тому подобных.
Представь - 10 минут назад сел смотреть предыдущий видос про бургер, а сам себе думаю - наверное, посмотрю и сам соображу, как это сделать на чистом JS. И тут открываю почту ииииии..... Женя как всегда - лучший!
Решил разобрать всю инфу в ролике детально и писать следом за тобой, Жека, но прочность осмысленно. Итог: в период с 00:00 по 1:38 я просмотрел и полностью "впитал" первые 23 минуты ролика. Большое спасибо за сей труд. Каждый твой ролик наполнен тонной нужной, полезной, а главное актуальной информацией, так же присутвует большое колличество советов, фич, которые нельзя прочесть в документации, ибо они нарабатываются лишь на практике при работе с проектом. Еще раз большое спасибо!! Вы помогаете людям становиться лучше и речь не только об навыках в Frontend'e. ))
Хах, а вот тут я тебя уже опередил, насмотревшись твоих видео, я начал верстать макеты и в процессе верстки вывел похожий способ делать меню-бургер)) Твои труды не прошли напрасно, спасибо тебе огромное
Очень редко ставлю лайки и пишу комментарии, но большое, просто огромное вам спасибо. Благодаря вашим подобным видео я начинаю понимать всю взаимосвязь html/css/JS и видеть использование всего этого на реальном проекте. Спасибо, ваши видео очень мотивируют продолжать заниматься этим.
Словами не передать насколько полезное и нужное видео, тяжело как новичку понять Java запросы но думаю со временем и этот язык подтяну, спасибо тебе большое!
Позитив и настроение Евгения. Блеск в глазах. Как это заряжает и заражает позитивом и желанием учиться. Прямо какая то Вёрсточная лихорадка начинается. Однозначно Гранд Мерси. Респект и Уважуха.
Интересно было посмотреть, спасибо! Добавил бы, что при использовании опции behavior со значением "smooth" в js нужно использовать полифил или бейбел. Ведь если я не ошибаюсь, то отвалится львиная доля safari браузеров и ie11(если его еще кто-то поддерживает). И отдельно хочу поблагодарить за твой труд! Получив базовые знания html css js было много нюансов с которыми было тяжело и долго реализовывать реальные проекты. Я хотел максимально быстро выйти на фриланс и уже в процессе разбираться с тонкостями разработки. И в этом мне нереально помог твой стартовый шаблон! Он закрывал большую часть проблем и нюансов возникающих в разработке. И даже когда я сталкивался с трудностями, о решении которых не говорилось в видосе по стартовому шаблону, я не бежал сразу в гугл за решением, а начинал копаться в сборке и в большинстве случаев находил там решение! Огромное спасибо!
Респект вам, Евгений!Теперь всем знакомым,желающим научиться делать классные сайты, после прохождения простейших курсов html/css/js рекомендую смотреть вас, идеальный следующий уровень.Спасибо!
Не так давно я поставил себе задачу, что хочу работать фрилансером, да и вообще освоить что-то новое и благодаря различным бесплатным сервисам и вашим видео, я смог получить свой первый заказ и успешно его выполнить :) Спасибо за канал!
like нужно ставить еще перед просмотром)))легко, понятно, доступно и очень качественно. нет слов)))))ЛУЧШИЙ КАНАЛ!!!!!!!!!!!!!!!субьективно-обьективное мнение)))Жека - сенсей))))))))нужно прописать snipet "Спасибо". так будет проще)))))))))
Ты просто мега-крут, как раз то над чем я мучался последнии 2 дня, а ты решил мои проблемы за пару минут и научил многому новому! Спасибо, что ты есть, пожалуйста продолжай!
Жалко, что способ с плавной прокруткой не поддерживается safari, тогда уж проще было просто в css написать для body{ Scroll-behavior: smooth; }, эффект был бы точно такой же
Как всегда - высший пилотаж! Спасибо! На вопрос о том, что еще снять - продолжать уроки по js. Без него никуда, я уж по вашим объяснениям начинаю ориентироваться в jquery :-)
Многие заказчики не любят стрелочки на смартфонах. Из-за того что их клиенты думают что пункт меню и стрелочка одно целое , нажимают на пункт меню и оно их кидает не туда. И злятся что меню работает не правильно , сталкивался на своем опыте
Классный видос) Плажка скролится потому что она позиционируется относительно предка. На сайте developer.mozilla написано: "Элемент выбивается из обычного потока документа, и для элемента в макете страницы не создается пространство. Он позиционируется относительно исходного содержащего блока, установленного viewport, за исключением случаев, когда один из его предков имеет свойство transform, perspective, или filter, установленное на что-то иное, кроме none, и в этом случае этот предок ведет себя как содержащий блок. (Обратите внимание, что существуют несогласованности браузера с perspective и filter, способствующими содержанию формирования блоков.) Его конечная позиция определяется значениями top, right, bottom и left. Это значение всегда создает новый контекст наложения. В печатных документах элемент помещается в одно и то же положение на каждой странице." Ваши уроки не проходят даром!)
Круто! Я тоже делал наподобие меню, неокторые моменты также реализовал (некоторые иначе, более сложным способом), но вот плавный скролл сделал с помощью свойства scroll-behavior: smooth; На jquery принципиально не делал, так как не хотелось ради этого тащить целую библиотеку, но вот не знал как сделать это же на чистом js (хотя и догадывался, что надо со смещениями работать и задействовать getBoundingClientRect, в одной статье подсмотрел). Теперь буду знать знать как это реализуется. У вас все это очень понятно выглядит, спасибо! Также было в новинку увидеть определение в js класс устройств (я только начинаю изучать js), надо будет тоже у себя так попробовать. Очень познавательно!!!
Женя, если не ошибаюсь, CSS-свойство transform вырывает объект из контекста. Ты упоминал об этом в видео про transform. Учусь по твоим видео - очень результативно! Благодарю!
@@FreelancerLifeStyle понимаю, я как - раз об этих плюшках и говорю. Скачал офигенный шаблон, в нём как - раз были эти плюшки и даже больше. Несколько суток пытался разобраться и только вчера у меня получилось.
Здравствуйте. Спасибо, что так подробно всё рассказываете, без снобизма и зазнайства. Вот всё прямо для простых ребят! Подскажите, конкретно по этому видео-уроку, данное меню для оптимизации сайта будет только в плюс? Если при этом стоит CMS Bitrix. Я вот думаю, что будет более оптимизировано - доделанное стандартное меню или ваш вариант? Потому что, как понимаю, ваш вариант предусматривает добавление/изменение пунктов меню/подменю из файла html на прямую. А у Bitirx есть свой компонент "Menu", который даёт возможность работы через административную панель, без захода в код (это довольно удобно и безопасно, в том числе и для обычных контент-менеджеров и других неразработчиков).
также делается кнопка наверх страницы. data-goto=".body" и самому body даем класс class="body" и вне зависимости позиционирования элементов,данная кнопка перенесет вас наверх страницы
Спасибо за однозначно годный контент. Думаю, было бы крайне неплохо, если бы ты запилил побольше видео с разработкой различных вещей с использованием именно ванильного JS'a, поскольку JQuery уже морально устарел, а вот ванилла будет жить, пока востребован веб:)
Как хорошо, что я зашла на ваш канал!!! Столько полезной информации, рабочие и доступные скрипты. Для меня, как начинающего верстальщика это просто находка! Спасибо за ваш труд🙏 А про слайдер есть контент?
Спасибо большое за ролик, очень помог в многих моментах! Будет круто еще показать как сделать на мобилках открытие меню свайпом, какие есть библиотеки для этого или вообще проще без них на чистом js
Если использовать position: absolute; в menu__body и убирать его в правую сторону, а не в левую, как на видео, то появляется горизонтальный скролл. Если использовать absolute и отправлять меню в левую сторону, то скролл не появляется. Как-то странно, не понимаю в чем причина И еще почему-то у меня не работает overflow: auto;, т.е. скролл не появляется
Очень полезное видео! С меня лайк =D. Было бы интересно (по крайней мере мне), если бы ты запил ролик, как сделать адаптивный touch слайдер. Когда у меня появилась такая задача, без подключения доп. библиотек, я пошёл шерстить инет. В итоге я решил задачу, однако, как мне кажется тот цыганский фокус на 670 строк, который у меня получился, это не самое правильное решение) Был бы рад увидеть правильное исполнение.
Маленький коммент: максимальное удобство для пользователя - которое, кстати, красной нитью проходит через все видео - достигается выезжанием меню для мобилки с ПРАВОЙ стороны, а также выравниванием пунктов меню СПРАВА. Люди, в основном, правши, держат мобилку правой рукой, и меню справа реально удобнее. На большом экране большим пальцем правой руки хрен дотянешься в левый верхний угол. Пришлось поправить: .menu__body { position: fixed; top: 0; right: -100%; width: 50%; height: 100%; background-color: darkgrey; padding: 100px 30px 30px 30px; transition: right 0.3s ease 0s; overflow: auto; } .menu__body._active { right: 0; }
здравствуйте, Евгений у меня вопрос о вашем Chrome Dev-Tools. Заранее простите, что пишу на русском языке такой вопрос: как у вас плавно применяются изменения и плавно показываются в браузере?
1. Не работает плавный переход к блоку на сайте. Переход мгновенный. 2. Пропадает стрелочка рядом с ссылкой в шапке, где должны выпасть подссылки. 3. Прописал для body overflow: hidden, все равно скроллится body, как ни крути. Помогите!
Дякую за чудовий контент. Дуже класна подача інформації, нічого зайвого. Вчуся за вашими уроками. Поставив би більше вподобайок, якщо можна було б. Дякую вам велике за вашу працю 🙂
Что еще снять?
🔴 Карта канала: miro.com/app/board/o9J_lZB3YKI=/
🔴 Получить доступ к плюшкам + поддержать канал: www.patreon.com/freelancerlifestyle
🔴 Telegram канал: t.me/freelancer_lifestyle (teleg.run/freelancer_lifestyle)
🔴 Telegram чат по верстке: t.me/flschat (teleg.run/flschat)
🔴 Facebook: facebook.com/freelancerlifestyle
🔴 Instagram: instagram.com/freelancer.lifestyle
Уроки по javascript). А точнее DOM, события и т.д, а потом хотелось бы практики, например, сделать табы или аккордеон
Добрый день! Интересно увидеть как делается пагинация, как показывать контент частями при клике
Было бы интересно посмотреть как правильно вставлять видео в верстку.
Слайдер )
@@dennisfisher2684 Есть же видео такое
А представьте не было бы таких людей, сколько десятков часов мы бы убивали на банальные вещи. Спасибо.
Пожалуйста! Рад что полезно!
Делаю сейчас закрытие меню-бургер по щелчку на ссылку в меню. Никак не работает. За примером далеко ходить не надо.
Он был бы немного беднее))
я так уже за год, вырос с твоих уроков, но начинал с них.)) как вырос, смотрю иногда, чтоб что-то вспомнить, ну и лайк поставить за труды. спасибо!
если позволишь, поделюсь своим не большим опытом.))))
1) лучше классы добавлять на li а не на ссылку! это важно, ибо в большинстве CMS, при натяжке такой верстке, проклянут, просто там на li класс можно прописать при инициализации меню к примеру в вордпресс, это гипер важно и будет попа боль... может кому пригодиться во классы вордпресса по умолчанию: nav-menu - этот класс ставиться на ul , menu-item - это класс пункта меню (li), 2) я бы вместо span сделал button причем с текстом внутри, только тексту задал бы нулевой размер, это поможет людям с инвалидностью, да и так верно по семантике, у нас там не декоративная стрелочка, а все-же это позиционируется как кнопка. но это не обязательно, можно так и не делать.))
3) кнопка бургера, это тоже кнопка а не блок! да, это не критично и плевать как делать, но корректно, когда кнопка, это все-же кнопка а не что-то другое. опять же, проблема будет у людей с инвалидностью.
4) не помешало бы честь тот факт, что клиент в будущем может добавить новый пункт меню, и наша верстка полетит в тар тарары.... я тоже сейчас сел себе писать подобное, для проектов, и вот как раз это одна из причин, по которой решил написать адаптивное меню.)))
5) я бы шапку не делал фиксированной с самого начала, не всегда оно уместно. как по мне, лучше сделать ее фиксированной после прокрутки к примеру 200-300px. это добавит адаптивности.
6) это уже мелочи, но лучше все обернуть сначала в - "window.addEventListener("DOMContentLoaded", () =>{}", как миним поможет людям с инвалидностью. есть еще пара мелких моментов, которые тоже часто могут вызвать боль в очень больших проектах, но не критично.))) к пример, лучше проверить сразу, а создалось ли меню и наши основные классы. потому что не мы будем создавать меню а php к примеру, он баганул и наш js пошел гулять ошибками по консоле.)))
Я кстати всегда ставлю классы на всё. Будь то p, strong, и на a в li и на li в a
@@Roderen li в а? 🙈
можешь объяснить, зачем надо код писать в DOMContentLoaded? Интересно
@@miraigrafit7865 "Заговорился")
@@ИльназГарайшин-ч6о ну бывает такое, что есть вещи, которые загружаются асинхронно, или строятся js кодом, в таком случает твоя логика поиска элементов через querySelector-ы будет работать неправильно, так как страница загрузиться, начнется работа условно твоего скрипта, он не сможет найти какой нибудь условный селектор типа body.main, потому что класс main навешивается скриптом другого js, который отрабатывает после твоего, и следовательно document.querySelector('body.main') будет null, ну а ты же для чего то делал этот поиск, чтобы для чего то использовать, следовательно логика твоей программы будет рушится.
У Жени скоро 200 тыс. подписчиков, а я до сих пор читаю поздравления с первой сотней)
Удачи тебе, Женя, спасибо за твои классные уроки, если чего-то не пойму или не хватит мотивации, стану твоим патроном.
Для меня ты единственный человек, которому хочется задонатить, тем более это заслуженно.
К концу года наберешь 500 тыс?))
Вопрос к тем, кто ставит дизлайки на видео... Ребята, за что? Человек старается, делает всё ради нас, получает с канала копейки (по меркам больших каналов). Он мог бы и кривлять рожи на видео и грести бабло, но он ставит моральные ценности выше денег. Он делится бесценным опытом, который вы не купите даже в Скиллбоксах и тому подобных.
Наш сенсей как всегда лучший!!!
Спасибо!)
Конечно, отлично сказано
Представь - 10 минут назад сел смотреть предыдущий видос про бургер, а сам себе думаю - наверное, посмотрю и сам соображу, как это сделать на чистом JS. И тут открываю почту ииииии..... Женя как всегда - лучший!
Ахах, спасибо!
Один из не многих обучающих блогеров которому лайк можно ставить не глядя. Спасибо Джексон!
Я рад!
@@FreelancerLifeStyle видео по jQuery есть на канале ? Вроде пролистал не нашёл. Если нет, то будет ли? Заранее благодарен!
Решил разобрать всю инфу в ролике детально и писать следом за тобой, Жека, но прочность осмысленно.
Итог: в период с 00:00 по 1:38 я просмотрел и полностью "впитал" первые 23 минуты ролика.
Большое спасибо за сей труд. Каждый твой ролик наполнен тонной нужной, полезной, а главное актуальной информацией, так же присутвует большое колличество советов, фич, которые нельзя прочесть в документации, ибо они нарабатываются лишь на практике при работе с проектом.
Еще раз большое спасибо!! Вы помогаете людям становиться лучше и речь не только об навыках в Frontend'e. ))
Хах, а вот тут я тебя уже опередил, насмотревшись твоих видео, я начал верстать макеты и в процессе верстки вывел похожий способ делать меню-бургер)) Твои труды не прошли напрасно, спасибо тебе огромное
Я рад
Очень редко ставлю лайки и пишу комментарии, но большое, просто огромное вам спасибо. Благодаря вашим подобным видео я начинаю понимать всю взаимосвязь html/css/JS и видеть использование всего этого на реальном проекте. Спасибо, ваши видео очень мотивируют продолжать заниматься этим.
Росту на твоих роликах, просто лучший!
Иногда не верится, что такой контент с крутой подачей дают бесплатно)
Спасибо!
делаю сайт для портфолио, по твоему видосу сделала меню-бургер, все получилось, ураааа! огромная благодарность за твой труд!
Это один из тех уроков, после которого смотришь на результат работы и не можешь перестать радоваться, спасибо большое за знания и хорошее настроение!
Словами не передать насколько полезное и нужное видео, тяжело как новичку понять Java запросы но думаю со временем и этот язык подтяну, спасибо тебе большое!
Позитив и настроение Евгения. Блеск в глазах. Как это заряжает и заражает позитивом и желанием учиться. Прямо какая то Вёрсточная лихорадка начинается. Однозначно Гранд Мерси. Респект и Уважуха.
Спасибо!
Интересно было посмотреть, спасибо! Добавил бы, что при использовании опции behavior со значением "smooth" в js нужно использовать полифил или бейбел. Ведь если я не ошибаюсь, то отвалится львиная доля safari браузеров и ie11(если его еще кто-то поддерживает).
И отдельно хочу поблагодарить за твой труд! Получив базовые знания html css js было много нюансов с которыми было тяжело и долго реализовывать реальные проекты. Я хотел максимально быстро выйти на фриланс и уже в процессе разбираться с тонкостями разработки. И в этом мне нереально помог твой стартовый шаблон! Он закрывал большую часть проблем и нюансов возникающих в разработке. И даже когда я сталкивался с трудностями, о решении которых не говорилось в видосе по стартовому шаблону, я не бежал сразу в гугл за решением, а начинал копаться в сборке и в большинстве случаев находил там решение! Огромное спасибо!
Всё легко когда ты знаешь, что делаешь. Поистине полезный урок. Спасибо!
Пожалуйста!
Я в повному захваті від відео, якісно, доступно ще й цікаво! Година перегляду на одному диханні! Ви крутий!
Ты реально круто подходишь к своему материалу
Спасибо, стараюсь)
Отличное начало дня!
Женя, благодарочка!!!😎
Респект вам, Евгений!Теперь всем знакомым,желающим научиться делать классные сайты, после прохождения простейших курсов html/css/js рекомендую смотреть вас, идеальный следующий уровень.Спасибо!
Спасибо!
Не так давно я поставил себе задачу, что хочу работать фрилансером, да и вообще освоить что-то новое и благодаря различным бесплатным сервисам и вашим видео, я смог получить свой первый заказ и успешно его выполнить :) Спасибо за канал!
Супер, я рад!
Как с тобой связаться? Интересно как ты начинал)
Спасибо! ты один из тех, благодаря кому я получил работу в front end !!!! спасибо огромное!!!!!!!!!!!!!!!!!!! вчера приняли на работу!!!
Спасибо! периодически заглядываю в твои туториалы, чтобы вспомнить как делаются некоторые штуки, которые давно не делал!
тебе тоже захотелось бургеров?)
100%
Спасибо, что напомнил. Пойду доем второй бургер
like нужно ставить еще перед просмотром)))легко, понятно, доступно и очень качественно. нет слов)))))ЛУЧШИЙ КАНАЛ!!!!!!!!!!!!!!!субьективно-обьективное мнение)))Жека - сенсей))))))))нужно прописать snipet "Спасибо". так будет проще)))))))))
перший раз я не зробила якусь помилку, і не шукала її 2 години😝
дякую за суперське відео🙏🏼
коментарий для продвижения ролика в тренды.
Спасибо!
Евгений, Вы просто супер!!! Я влюбилась в js, когда так четко, последовательно и доступно все излагается. И результат - выше всех похвал))))
Ты просто мега-крут, как раз то над чем я мучался последнии 2 дня, а ты решил мои проблемы за пару минут и научил многому новому! Спасибо, что ты есть, пожалуйста продолжай!
Так грамотно и понятно преподносить информацию это настоящий талант! Спасибо вам!
вряд ли кто-нибудь еще сможет так хорошо объяснить, Спасибо, Жека
Волнительно, ну что ж погнали):))) ЖЕКА ЛУЧШИЙ!
Фуууух чётко!
Всё сработало спасибо! Патрон в теме:)
Женя, прям не знаю, какие слова благодарности писать! СПАСИБО за крутой контент! миллион лайков! Было бы здорово еще про WP уроки сделать;)
Жалко, что способ с плавной прокруткой не поддерживается safari, тогда уж проще было просто в css написать для body{
Scroll-behavior: smooth;
}, эффект был бы точно такой же
Отличный совет. Жека внатуре перемудрил там с этим способом.
спасибо за smooth!!!
странно, у меня не работает
Ты первый человек на которого я подписался. Всё очень круто, понятно и динамично.В 35 не поздно начинать учиться верстке? Дошел до флексов.
Спасибо! Нет, конечно не поздно!
Канал Евгения настоящая сокровищница 👍👍👍
Спасибо, Жека, просто большое спасибо)
Многому научился именно от тебя)
Пожалуйста!
Женя, спасибо тебе большое!!! Как всегда, твой контент спасает 🤝
Спасибо большое за такой развернутый мануал! Просидел пол дня, но все сделал под себя!
Очень благодарен за мануал!
Как всегда - высший пилотаж! Спасибо! На вопрос о том, что еще снять - продолжать уроки по js. Без него никуда, я уж по вашим объяснениям начинаю ориентироваться в jquery :-)
Многие заказчики не любят стрелочки на смартфонах.
Из-за того что их клиенты думают что пункт меню и стрелочка одно целое , нажимают на пункт меню и оно их кидает не туда. И злятся что меню работает не правильно , сталкивался на своем опыте
Классный видос)
Плажка скролится потому что она позиционируется относительно предка. На сайте developer.mozilla написано:
"Элемент выбивается из обычного потока документа, и для элемента в макете страницы не создается пространство. Он позиционируется относительно исходного содержащего блока, установленного viewport, за исключением случаев, когда один из его предков имеет свойство transform, perspective, или filter, установленное на что-то иное, кроме none, и в этом случае этот предок ведет себя как содержащий блок. (Обратите внимание, что существуют несогласованности браузера с perspective и filter, способствующими содержанию формирования блоков.) Его конечная позиция определяется значениями top, right, bottom и left.
Это значение всегда создает новый контекст наложения. В печатных документах элемент помещается в одно и то же положение на каждой странице."
Ваши уроки не проходят даром!)
ДААА!!)) Наконец-то!!!))) Спасибо, Жека!!!))))
Пожалуйста!
Спасибо за видео, Жень! Посмотрел и все сделал. Все работает как надо!
Теперь на реальном проекте буду нарабатывать практику)) Будь здоров!
Круто! Я тоже делал наподобие меню, неокторые моменты также реализовал (некоторые иначе, более сложным способом), но вот плавный скролл сделал с помощью свойства scroll-behavior: smooth; На jquery принципиально не делал, так как не хотелось ради этого тащить целую библиотеку, но вот не знал как сделать это же на чистом js (хотя и догадывался, что надо со смещениями работать и задействовать getBoundingClientRect, в одной статье подсмотрел). Теперь буду знать знать как это реализуется. У вас все это очень понятно выглядит, спасибо! Также было в новинку увидеть определение в js класс устройств (я только начинаю изучать js), надо будет тоже у себя так попробовать. Очень познавательно!!!
Только подумал о бургер меню на чистом js и сразу вышло это видео. Женя ты читаешь мысли ? )). Вообщем я хочу сказать большое спасибо за твои труды 👍
Ох напряжненько, но оч познавательно😮
Спасибо большое, приблизится бы на процентов 30 % к такому уровню.
только практика приблизит тебя к такому уровню
Евгений, очень близок ты мне по духу! Надеюсь получится однажды лично познакомиться! спасибо за уроки. Благодаря им скоро стану твоим коллегой )
Я рад!
Супер! Спасибо за видео)! Очень ждал его!
"То что нужно", как и все остальные ролики. Лайк до прсомотра.
Дуже дякую! Жека - ти найкращий! Тобі добре вдається доносити інформацію!
І головне - тепер ми знаємо, як це зробити!)))
Спасибо Женя, теперь чтобы сделать плавный скролл не нужно цеплять целую бибилиотеку
но нужно ещё писать совместимость с браузерами
Евгений, это все хорошо про запрет скролла при активном меню..но, как запретить скролл на iOS (Safari)?) такой метод не работает в этой экосистеме)
все ваши виде это лучшее что можно найти на русскоязычном сегменте! Я поддерживаю вас во всём! желаю мира и спокойствия вашей стране и семье
Женя, если не ошибаюсь, CSS-свойство transform вырывает объект из контекста. Ты упоминал об этом в видео про transform.
Учусь по твоим видео - очень результативно! Благодарю!
Хммм, это не объясняет артефакт.
Ещё один? Интересно!
Edit: от блин, я только вчера разобрался самостоятельно со всем этим... Но всё равно, спасибо за видео!
Пожалуйста! Тут больше плюшек
@@FreelancerLifeStyle понимаю, я как - раз об этих плюшках и говорю. Скачал офигенный шаблон, в нём как - раз были эти плюшки и даже больше. Несколько суток пытался разобраться и только вчера у меня получилось.
Велика подяка! Чудовий урок!!
Спасибо тебе за твои бесценные уроки 🔥🔥🔥
Авансом - Спасибо !)
Пожалуйста!
Большое спасибо за такой подробный урок! У вас отличная подача и очень понятные объяснения 👍
СПАСИБО!!!!! Как всегда, то что нужно доступным языком!!!
Пожалуйста!
Спасибо вам Евгений, за качественный контент.
Ваше умение качественно доносить информацию, очень ценно.
Успехов вам!
Спасибо, рад что полезно!
Здравствуйте. Спасибо, что так подробно всё рассказываете, без снобизма и зазнайства. Вот всё прямо для простых ребят!
Подскажите, конкретно по этому видео-уроку, данное меню для оптимизации сайта будет только в плюс? Если при этом стоит CMS Bitrix.
Я вот думаю, что будет более оптимизировано - доделанное стандартное меню или ваш вариант? Потому что, как понимаю, ваш вариант предусматривает добавление/изменение пунктов меню/подменю из файла html на прямую. А у Bitirx есть свой компонент "Menu", который даёт возможность работы через административную панель, без захода в код (это довольно удобно и безопасно, в том числе и для обычных контент-менеджеров и других неразработчиков).
также делается кнопка наверх страницы.
data-goto=".body"
и самому body даем класс class="body"
и вне зависимости позиционирования элементов,данная кнопка перенесет вас наверх страницы
просто кайфанул с результатов!!)) спасибо за уроки))
Супер. Жень спасибо тебе что показываеш и рассказываешь мелкие детали которые очень важны. Жду не дождусь видео по jS.
Дай бог тебе здоровья!
Спасибо!
Спасибо! Взял несколько моментов на вооружение :)
Крутой канал!
В самом начале по изучению css) Просто лайк зашёл поставить)
Женя, огромное человеческое спасибо! Столько фишек, так все подробно рассказано! Мегаполезно! Жаль, нельзя поставить 10 лайков...
Дякую за урок! Ця годинна була дуже цікавою та інформативною!
Просто шикарный урок ) СПАСИБООО)! Невероятная подача))
Круто. Очень понравилось. Взял себе на заметку
Спасибо за однозначно годный контент. Думаю, было бы крайне неплохо, если бы ты запилил побольше видео с разработкой различных вещей с использованием именно ванильного JS'a, поскольку JQuery уже морально устарел, а вот ванилла будет жить, пока востребован веб:)
Как хорошо, что я зашла на ваш канал!!! Столько полезной информации, рабочие и доступные скрипты. Для меня, как начинающего верстальщика это просто находка! Спасибо за ваш труд🙏
А про слайдер есть контент?
Спасибо большое за ролик, очень помог в многих моментах! Будет круто еще показать как сделать на мобилках открытие меню свайпом, какие есть библиотеки для этого или вообще проще без них на чистом js
Спасибо за видео! А в чем разница между медиа-запросами, которые проверяют размер окна, и js кодом?
Если использовать position: absolute; в menu__body и убирать его в правую сторону, а не в левую, как на видео, то появляется горизонтальный скролл. Если использовать absolute и отправлять меню в левую сторону, то скролл не появляется. Как-то странно, не понимаю в чем причина
И еще почему-то у меня не работает overflow: auto;, т.е. скролл не появляется
Очень понравился урок Бургер меню, все доступно и понятно. идем дальше
Спасибо за видос. К сожалению, смогу посмотреть только завтра. Лайк-авансом!
24:51 Просто фантастика!!!! Настоящая магия!
Крутейшее видео!!! Спасибо большое!
супер огонь, просто адово пламя!🔥🔥🔥
Привет, а что сейчас используется вместо pageYOffset, и как теперь будет выглядеть эта часть кода
у меня он тоже перечеркнут и вообще почемуто этот код у меня не работает
Очень полезное видео! С меня лайк =D. Было бы интересно (по крайней мере мне), если бы ты запил ролик, как сделать адаптивный touch слайдер. Когда у меня появилась такая задача, без подключения доп. библиотек, я пошёл шерстить инет. В итоге я решил задачу, однако, как мне кажется тот цыганский фокус на 670 строк, который у меня получился, это не самое правильное решение) Был бы рад увидеть правильное исполнение.
Крутое видео! Офигенный материал!))
Спасибо большое!
Боже, шикарный видос! Спасибо. Все так просто и красиво)
Очень качественный урок, спасибо!
Пожалуйста!
анимация на left не лучшее решение, использование translate более оптимизировано, т.к. выполняется на одном слое без перерисовки
Дякую за контент. Уже другий день шукаю подібну інформацію, а тут все роз'яснено чітко і зрозуміло. Ще раз дякую.
Как всегда топчик)
Спасибо!
Маленький коммент: максимальное удобство для пользователя - которое, кстати, красной нитью проходит через все видео - достигается выезжанием меню для мобилки с ПРАВОЙ стороны, а также выравниванием пунктов меню СПРАВА. Люди, в основном, правши, держат мобилку правой рукой, и меню справа реально удобнее. На большом экране большим пальцем правой руки хрен дотянешься в левый верхний угол.
Пришлось поправить:
.menu__body {
position: fixed;
top: 0;
right: -100%;
width: 50%;
height: 100%;
background-color: darkgrey;
padding: 100px 30px 30px 30px;
transition: right 0.3s ease 0s;
overflow: auto;
}
.menu__body._active {
right: 0;
}
здравствуйте, Евгений у меня вопрос о вашем Chrome Dev-Tools. Заранее простите, что пишу на русском языке
такой вопрос: как у вас плавно применяются изменения и плавно показываются в браузере?
1. Не работает плавный переход к блоку на сайте. Переход мгновенный.
2. Пропадает стрелочка рядом с ссылкой в шапке, где должны выпасть подссылки.
3. Прописал для body overflow: hidden, все равно скроллится body, как ни крути.
Помогите!
Женя, большое спасибо за видео!
Пожалуйста!
Дякую за чудовий контент. Дуже класна подача інформації, нічого зайвого. Вчуся за вашими уроками. Поставив би більше вподобайок, якщо можна було б. Дякую вам велике за вашу працю 🙂
Огромное спасибо за знание которую ты нам даешь!!!
дуже гарне відео! дякую, все зробила,все працює!!!!!!!!!!👍👍👍
ну да угарные
Спасибо большое , круто бро
Пожалуйста!