Привет. Предлагаю тебе сделать видео о том, как использовать библиотеки правильно, то есть к примеру, вырезания функционала(чтобы она стала менее тяжеловесной). А то я заметил тенденцию твои подписчиков, что они считают что надо все писать с нуля. Надеюсь ты так не считаешь и сможешь объяснить им, что как самопис, так и библиотеки надо использовать разумно
Фрилансер по жизни - IT и фриланс Подскажи пожалуйста как сделать чтобы фон оставался на месте и при скролле страницы тексты, каждый текст со своим фоном прокручивался на верх как тут 0:22
@@nitagas187, либо вешаешь на body картинку и делаешь её фиксированной или в любое место добавляешь картинку делаешь её fixed. И zindex минус один допустим.
Спасибо тебе за бесплатные и невероятно качественные уроки! Ты - один из немногих, кто показывает всё с нуля и на чистом JS. Не всегда хочется пользоваться сторонними библиотеками и всякими jquery. Спасибо и за это! Продолжай делать контент и помни: живи, а делай годный контент в свободное время
вообще не разбираюсь в Js, по рекомендации зашёл. Интересно стало, и тут пожалуйста, все очень понятно. Немного посидел, переписал, все сделанное, буду учить дальше). Спасибо большое за информацию!
все ваши виде это лучшее что можно найти на русскоязычном сегменте! вы самый лучший! Я поддерживаю вас во всём! желаю мира и спокойствия вашей стране и семье!!!
Только наткнулся на это видео, видать колокольчик забыл. Но уже заинтриговало. Представляю как мои заготовки оживут после просмотра. Спасибо за такие вот видео. Очень полезно и помогает в развитии.
Спасибо, пол дня убил чтобы найти как это сделать без библиотек. Обычно на ютубе ничего путного никогда не находил, но потеряв надежду что то найти решил написать, и нашел!
Спасибо вам огромное, ваши видео кардинально меняют представление о, казалось бы, таких сложных моментах. Здорово, что вам пришла в голову снимать подобные ролики.
а я думал это сложно, думал всякие плагины нужно подключать, которые понять сложнее и гораздо дольше, и подключал, лол, даже не пытался написать все руками, спасибо Жека! за почти что год я на ютубе лучше тебя никого не нашел, ни на англоязычном ни на ру
Очень помог, действительно было интересно узнать о реализации такой анимации без сторонних библиотек Все доступно, а самое главное - в последствии можно легко настроить анимацию по своему усмотрению
Спасибо. Очень доходчиво объяснили механизм добавления такой анимации Мне лично не особо нравится когда на сайте все летает и ездит. Но любое желание заказчика... А благодаря вам мы знаем как это желание в жизнь воплотить.
8:46 11:54 не анимировать когда скролишь вверх 13:30 анимация текста при скроле 15:39 17:33 анимация изображения + текст 19:32 поочередное появление (комментарий для себя)
@@iventeye затраты, время. Хорошо когда вы работаете чисто на себя и один. В остальном есть множество библиотек для этого дела, а если там нет функционала его можно дописать. Вот смотрите у вас есть задача, построить многофункциональный сайт. Для этого обычно либо используют фреймворк или уже примерно заточенные модули на cms под вашу задачу. Вопрос: зачем строить свой велосипед, если уже есть машина, которая вас возит. (аналогия думаю понятна). Да бывают случаи когда нужно что то разработать почти с нуля, но такого на практике не много, получается нет смыла разрабатывать что то заново. Тот же бустрап, вы же не собираетесь его выкидывать, у него хорошая мультиплатформенная сетка. Да согласен может немного тяжеловесна, в этом случае берут за основу чисто расработанную сетку и убирают все остальное, т.к. В большинстве случаев стили будут применяться другие. Я все это к чему: если есть что то готовое, используйте по максимуму. Если вы будете разбираться как и где все это работает до мелочей, уйдёт куча времени, а если вы работаете в компании, это время могло пойти на другие полезные вещи
В тех же библиотеках можно просто вырезать некую функциональность, которая вам не понадобится. За счёт этого уменьшится вес, плюс вы в большей степени защищены от багов, чем при разработке своего скрипта. Рекомендую использовать туже самую AOS. Вырезать все что вам не нужно и использовать. Зато вы будете уверены что все будет работать как надо
видео наверное полезное для тех кто только начинает изучать фронт. Но даже в этом случае лучше бы сказать что так делать можно но не желательно. Потому что есть Intersection Observer API
Большое спасибо тебе за твою работу! Канал просто бомба, для меня как новичка это просто кладязь полезной и интересной инфы. Отдельно благодарю за качество монтажа, это просто нечто)
Ура, новый выпуск "как это сделать" И ещё, на вашем сайте, в разделе transform есть спойлер matrix3d. Там 16 букв N в скобках. И они все не переходят на следующую строку. Поэтому в моб. версии сайта эти N, N... Не помещаются на всей ширине телефона. Тоесть просто нужно сделать так, чтобы они переходили на след. строку.
Как всегда всё супер!) Большое спасибо) Только вот, хотел бы ещё увидеть видео от Вас, о том, как сделать анимированный счётчик (клиентов, заказов), где при скроле на элемент идёт отсчёт от 0 до заданного значения. В лендингах такое часто используется
Тем кто пишет в scss будет полезно.Если есть какие-то предложения или коррективы по миксину - пишите :) @mixin scroll-appearance($X, $Y) { transition: all 1s ease-in-out 0s; transform: translate($X, $Y); opacity: 0; &._active { transform: translate(0px, 0px); opacity: 1; } }
Спасибо. Мне урок понравился. Нет обычного твоего наигранного ютубного - эгэгей!!!, -...погнали!!!, -... замечательно!!!. Извини это обычно не круто) (Хотя в уроке про адаптивный текст, это было искренне, я почувствовал что ты был на самом деле очень рад, в остальных всех уроках - "не верю") Интересно было бы посмотреть как сделать подобную функцию для анимации более гибкой, например как magicscroll, хотя бы примерно))) В общем годный контент. Спасибо!
Возможно кому-то поможет. У меня не работала анимация, потому что не заметил в самой первой строчке у себя ошибку: перед '_anim-items' должна стоять точка, либо должно быть написано div._anim-items
Женя, видео класс👍💪. Очень полезное. У меня есть к тебе такой вопрос: мне 15 лет и я изучаю вёрстку и знаю html, css, препроцессор scss, немного gulp и другие технологии по типу git, npm и так далее. Но я хочу стать фронтендом и для этого мне нужен js и я его изучаю но я его трудно осваиваю. Мне все же продолжать изучать js в 15 лет? Или есть другие решения по типу изучение лучше вёрстки и потом когда буду старше начну js изучать. Интересен твои совет ;)
Классно, на нативочке все работает. Но честно вот для анимации как раз и можно подключить библиотеку, они очень легковесные. Но за видео спасибо, пригодится.
Подсказка не большая, можете не проверять на > 0 а просто записать aniItems.length и все, JS движок проверит, длинна массива не falsy ли значения. А falsy значение это null,false,true, 0 как раз наш , 0.0, -0.0, пустая строка.
Огромное спасибо за доступный и бесплатный формат подачи, и то, что осталось на русском языке из материалов. Очень надеюсь и жду, когда все хорошо закончится для Украины и украинцев. Жаль, что русскоязычный сегмент потерял такого талантливого блогера. Мира и процветания тебе, твоей семье и твоей родине.
Как всегда все супер!!! Жека братан этот пример я могу найти в гитхабе??? Хочется видеть код виде локального репозитория, понять как делать такие анимации, проэксперементировать)))
Жень, а не мог бы ты рассказать о том, что такое DHTML и почему он так редко используется? И вообще о каких-то ортодоксальных таких технологиях, которые либо устарели, либо не популярны, но представляют, скажем, научный интерес) Можно ли такой ролик сделать в качестве общепознавательного и развлекательного? Ведь есть еще какой-то XHTML и другие маргинальные технологии, да? Почему они не взлетели? Что еще ты видел на своем 12-летнем веку верстальщика? Что казалось перспективным, но со временем отжило? Интересно было бы такое узнать)
🤟Полезно?
🔴 Получить доступ к плюшкам + поддержать канал: 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
Привет. Предлагаю тебе сделать видео о том, как использовать библиотеки правильно, то есть к примеру, вырезания функционала(чтобы она стала менее тяжеловесной). А то я заметил тенденцию твои подписчиков, что они считают что надо все писать с нуля. Надеюсь ты так не считаешь и сможешь объяснить им, что как самопис, так и библиотеки надо использовать разумно
Фрилансер по жизни - IT и фриланс Подскажи пожалуйста как сделать чтобы фон оставался на месте и при скролле страницы тексты, каждый текст со своим фоном прокручивался на верх как тут 0:22
@@nitagas187, либо вешаешь на body картинку и делаешь её фиксированной или в любое место добавляешь картинку делаешь её fixed. И zindex минус один допустим.
Точнее не в любое место. А чтобы у этой картинки был лишь один родитель-body
Братишка, подскажи, что за расширение в VSCode со снипетами? Пахом с Епифаном спрашивают.
Спасибо тебе за бесплатные и невероятно качественные уроки! Ты - один из немногих, кто показывает всё с нуля и на чистом JS. Не всегда хочется пользоваться сторонними библиотеками и всякими jquery. Спасибо и за это! Продолжай делать контент и помни: живи, а делай годный контент в свободное время
Хех, спасибо!
Я:Только вчера задумался над такой анимацией на сайте.
Жека: вот держи!
Спасибо!
@@FreelancerLifeStyle это тебе спасибо, я пол инета перерыл в поисках решения)
@@FreelancerLifeStyle а самое главное, что обьясняешь не на древнеэльфийском, а на понятном языке)
ты топчик!
@@FreelancerLifeStyleвсем привет а почему анимация не работает на андроиде ?
Сморю этого человека уже почти год! Нету слов просто,
низкий поклон! спасибо!
вообще не разбираюсь в Js, по рекомендации зашёл. Интересно стало, и тут пожалуйста, все очень понятно. Немного посидел, переписал, все сделанное, буду учить дальше). Спасибо большое за информацию!
Я рад! Пожалуйста!
Спасибо за внятный и понятный урок. Жаль, так мало людей Вам поставили одобрительную оценку из тех, кто просмотрел видео (
Пожалуйста!
Наконец-то!!! Всё время хотел понять как это работает, да всё руки не доходили.Спасибо большое!
Пожалуйста!
просто огромное количество информации в одном ролике, обязательно навешаю ко всему)
все ваши виде это лучшее что можно найти на русскоязычном сегменте! вы самый лучший! Я поддерживаю вас во всём! желаю мира и спокойствия вашей стране и семье!!!
Сложный js простыми словами от Жеки) Спасибо, огромный вклад в наше образование)
Только наткнулся на это видео, видать колокольчик забыл. Но уже заинтриговало. Представляю как мои заготовки оживут после просмотра. Спасибо за такие вот видео. Очень полезно и помогает в развитии.
Буквально каждое видео - невероятно годный контент. Не канал, а сокровище. Очень рад, что встретил его. Спасибо большое и удачи!
Спасибо!
Как раз то что нужно мне сейчас для заказа) Спасибо! лайк
Пожалуйста!
Лучший! Спасибо! Только твои туторы адекватно работают с первого раза!
Жека, человечище с большой буквы. Разложил все по полкам. Очень годно. Спасибо ОГРОМНОЕ!!
Спасибо, пол дня убил чтобы найти как это сделать без библиотек. Обычно на ютубе ничего путного никогда не находил, но потеряв надежду что то найти решил написать, и нашел!
Спасибо вам огромное, ваши видео кардинально меняют представление о, казалось бы, таких сложных моментах. Здорово, что вам пришла в голову снимать подобные ролики.
Один из самых крутых каналов, очень много полезного. Спасибо большое!
Ура! Злободневный вопрос! Сейчас буду смотреть! Лайк поставил сразу 😜
Спасибо!
а я думал это сложно, думал всякие плагины нужно подключать, которые понять сложнее и гораздо дольше, и подключал, лол, даже не пытался написать все руками, спасибо Жека! за почти что год я на ютубе лучше тебя никого не нашел, ни на англоязычном ни на ру
Спасибо!
Чем больше узнаю, тем больше понимаю что изучать и изучать ещё оооочень много! Спасибо Жека!
Только увидела новое видео - сразу лайк, а потом уже смотреть.
Спасибо!
Женя, живи вечно! Ты сила!
Спасибо!
Рома дуже дякую тобі за урок, черпаю спокій та рівновагу, дуже цінні знання. Мирного неба
Очень помог, действительно было интересно узнать о реализации такой анимации без сторонних библиотек
Все доступно, а самое главное - в последствии можно легко настроить анимацию по своему усмотрению
Дай тобі Боже здоров'я, добрий чоловіче!!!
Дякую!
Как мне нравится твой канал!!! Все понятно и очень нравится твой стиль преподавания!!!
Я рад!
Спасибо. Очень доходчиво объяснили механизм добавления такой анимации
Мне лично не особо нравится когда на сайте все летает и ездит. Но любое желание заказчика... А благодаря вам мы знаем как это желание в жизнь воплотить.
80к Жека, мои поздравления!))) Урок по скроллу супер полезный спасиб!!!
Спасибо!
Только посмотрел про параллакс, а тут и анимация появилась. Спасибо, Жека! очень пригодится 🤔
Супер!
Спасибо большое за такое подробное описание и коментирование кода!
Всё работает))
Красавчик Женя!!! Я так долго искал урок по этой теме, и вы великолепно все разъяснили показали. Спасибо вам огромное.
Дякую, гарний приклад ))
Дякую за твої труди)
8:46
11:54 не анимировать когда скролишь вверх
13:30 анимация текста при скроле
15:39
17:33 анимация изображения + текст
19:32 поочередное появление
(комментарий для себя)
Огромное спасибо за годную информацию! Ваши видео помогают мне во многом!
Спасибо, Жека! Давно хотел узнать как это можно делать без библиотек на чистом js и теперь буду использовать.
Супер!
Не рентабельно
@@СергейДемин-г5в а что рентабельно?
@@iventeye затраты, время. Хорошо когда вы работаете чисто на себя и один. В остальном есть множество библиотек для этого дела, а если там нет функционала его можно дописать. Вот смотрите у вас есть задача, построить многофункциональный сайт. Для этого обычно либо используют фреймворк или уже примерно заточенные модули на cms под вашу задачу. Вопрос: зачем строить свой велосипед, если уже есть машина, которая вас возит. (аналогия думаю понятна). Да бывают случаи когда нужно что то разработать почти с нуля, но такого на практике не много, получается нет смыла разрабатывать что то заново. Тот же бустрап, вы же не собираетесь его выкидывать, у него хорошая мультиплатформенная сетка. Да согласен может немного тяжеловесна, в этом случае берут за основу чисто расработанную сетку и убирают все остальное, т.к. В большинстве случаев стили будут применяться другие. Я все это к чему: если есть что то готовое, используйте по максимуму. Если вы будете разбираться как и где все это работает до мелочей, уйдёт куча времени, а если вы работаете в компании, это время могло пойти на другие полезные вещи
В тех же библиотеках можно просто вырезать некую функциональность, которая вам не понадобится. За счёт этого уменьшится вес, плюс вы в большей степени защищены от багов, чем при разработке своего скрипта. Рекомендую использовать туже самую AOS. Вырезать все что вам не нужно и использовать. Зато вы будете уверены что все будет работать как надо
то, что я искала! Спасибо! тысяча плюсиков в карму)))
Очень нужная инфа, спасибо!
Пожалуйста!
видео наверное полезное для тех кто только начинает изучать фронт.
Но даже в этом случае лучше бы сказать что так делать можно но не желательно.
Потому что есть Intersection Observer API
Большое спасибо тебе за твою работу! Канал просто бомба, для меня как новичка это просто кладязь полезной и интересной инфы.
Отдельно благодарю за качество монтажа, это просто нечто)
Спасибо!
Ай да Жека! Всегда умеет порадовать годнотой! Лайкос однозначно)
Спасибо!
Ну что сказать просто ЛУЧШИЙ !!!!!!!!!!!!!!!!!!!!!
видно как ты кайфуешь в конце от проделанной работы
Спасибо! Не всё, конечно, понятно, но есть над чем поломать голову. Отличный урок!
Как Вы делаете анимацию на сайтах? Используете ли animate.css и wow.js или делаете на чистом js? Актуально ли в 2021 использовать animate.css?
Полезная. Информация. Проверять я ее конечно же буду :D
+идея для видео - блочный скроллинг (fullpage.js)
Спасибо. Искал везде материал и опять нашел то, что нужно у тебя)).
Круто! Есть куда стремиться)) Видел такую анимацию у девушки веб-дизайнера на её сайте.
Повернувся до відео - це коли ти вже розумієш, що пишеться в js - супер!
Фрилансер, благодарю! Все получилось!!!
Только вчера искал как это сделать ничего не нашёл и сегодня ты делаешь такой подарок спс^
Пожалуйста!
Спасибо за скрипт Жека! Шикарный урок как всегда! Обнял
Как всегда топ! Спасибо, Жека
Пожалуйста!
Отличный урок, Женя, спасибо большое! Обучаюсь только по твоим видео 👍
Я рад!
один з кращих для мене каналів по фронту !!!
як завжди - ТОП
Дякую!
Уже час сижу и не понимаю почему ошибка в консоле(
Очень классно выглядит, правда понял только суть. Завтра попробую за видео повторить. Урок очень качественный. Лайк подписка.
Ура, новый выпуск "как это сделать"
И ещё, на вашем сайте, в разделе transform есть спойлер matrix3d. Там 16 букв N в скобках. И они все не переходят на следующую строку. Поэтому в моб. версии сайта эти N, N... Не помещаются на всей ширине телефона. Тоесть просто нужно сделать так, чтобы они переходили на след. строку.
Ну или просто написать три точки
Супер, спасибо! Столько тонкостей показал.
Теперь ноутбук при просмотре этого сайта греет немного лучше. Спасибо :)
Слабенький у тебя ноутбук, если его это так напрягает )))
Женя, спасибо за видео! Супер!
Как всегда всё супер!) Большое спасибо)
Только вот, хотел бы ещё увидеть видео от Вас, о том, как сделать анимированный счётчик (клиентов, заказов), где при скроле на элемент идёт отсчёт от 0 до заданного значения. В лендингах такое часто используется
Как же я ждал этого видео ))
Хех, надеюсь полезное!)
невероятно полезное видео!
благодарю за контент
успехов
Спасибо!
Женя, это огонь!! Спасибо!!
Евгений огромное спасибо !!!!!
Пожалуйста!
Без азов JS немного сложно заходит. Лайк и СПАСИБО!
Азы будут!
Как всегда все круто! Спасибо! вот вопрос, для вэб программирования нужно углубление в JS? или достаточно знать какую то базу? И будут ли уроки по JS?
Для верстки базу, для программирования глубже. Уроки по JS будут!
@@FreelancerLifeStyle благодарю, будем ждать!
Максимально полезное видео!
Я рад!
Спасибо огромное!! всё по сути и понятно!
Дякую! Очень полезный урок!
Я уже обыскался, как сделать такую анимацию. Спасибо тебе огромное
Как всегда на высоте, вот только в силу обыденности уже лень писать подобные комментарии, ведь и без них и дураку все понятно) теперь ждём js ♥️♥️♥️
JS уже скоро!
Спасибо!
Как всегда - то, что нужно!)
Пожалуйста!
Тем кто пишет в scss будет полезно.Если есть какие-то предложения или коррективы по миксину - пишите :)
@mixin scroll-appearance($X, $Y) {
transition: all 1s ease-in-out 0s;
transform: translate($X, $Y);
opacity: 0;
&._active {
transform: translate(0px, 0px);
opacity: 1;
}
}
Спасибо за видосы, просто The Best!!
Жека спасибо за видос как всегда на высоте
Пожалуйста!
Спасибо. Мне урок понравился.
Нет обычного твоего наигранного ютубного - эгэгей!!!, -...погнали!!!, -... замечательно!!!. Извини это обычно не круто)
(Хотя в уроке про адаптивный текст, это было искренне, я почувствовал что ты был на самом деле очень рад, в остальных всех уроках - "не верю")
Интересно было бы посмотреть как сделать подобную функцию для анимации более гибкой, например как magicscroll, хотя бы примерно)))
В общем годный контент.
Спасибо!
Спасибо!
Возможно кому-то поможет. У меня не работала анимация, потому что не заметил в самой первой строчке у себя ошибку: перед '_anim-items' должна стоять точка, либо должно быть написано div._anim-items
ААААААА часа два сидел искал ошибку, код переделывал. А всё дело было в точке)) спасибо!
ты очень крут) спасибо за урок
Пожалуйста!
Женя, видео класс👍💪. Очень полезное.
У меня есть к тебе такой вопрос: мне 15 лет и я изучаю вёрстку и знаю html, css, препроцессор scss, немного gulp и другие технологии по типу git, npm и так далее. Но я хочу стать фронтендом и для этого мне нужен js и я его изучаю но я его трудно осваиваю. Мне все же продолжать изучать js в 15 лет? Или есть другие решения по типу изучение лучше вёрстки и потом когда буду старше начну js изучать. Интересен твои совет ;)
Изучать нужно поэтапно, возраст не помеха
Классно, на нативочке все работает. Но честно вот для анимации как раз и можно подключить библиотеку, они очень легковесные. Но за видео спасибо, пригодится.
Люблю руками под задачу. За это больше платят)
Привет, еще как полезно и интересно. Спасибо большое.
Спасибо большое!)))
Пожалуйста!
Жека, уроки - пушка!)) Скажи пожалуйста, как ты динамически обновляешь браузер при верстке, что изменения видны сразу же?
А все, нашел, кому надо - ua-cam.com/video/stFOy0Noahg/v-deo.html&feature=emb_rel_end
Спасибо!
Ого))
Подсказка не большая, можете не проверять на > 0 а просто записать aniItems.length и все, JS движок проверит, длинна массива не falsy ли значения. А falsy значение это null,false,true, 0 как раз наш , 0.0, -0.0, пустая строка.
Возможно ошибаюсь, но где-то это не сработало, по этому пишу наверняка)
Ух, как актуально))
Я рад!
Супер!
Огромное спасибо за доступный и бесплатный формат подачи, и то, что осталось на русском языке из материалов. Очень надеюсь и жду, когда все хорошо закончится для Украины и украинцев. Жаль, что русскоязычный сегмент потерял такого талантливого блогера. Мира и процветания тебе, твоей семье и твоей родине.
Великолепно! Спасибо большое!
Спасибо! Круто, как всегда 😉
Как всегда все супер!!! Жека братан этот пример я могу найти в гитхабе??? Хочется видеть код виде локального репозитория, понять как делать такие анимации, проэксперементировать)))
как всегда топовый контен!
Дарова, Жека, спасибо за урок
Пожалуйста!
Жень, а не мог бы ты рассказать о том, что такое DHTML и почему он так редко используется? И вообще о каких-то ортодоксальных таких технологиях, которые либо устарели, либо не популярны, но представляют, скажем, научный интерес) Можно ли такой ролик сделать в качестве общепознавательного и развлекательного? Ведь есть еще какой-то XHTML и другие маргинальные технологии, да? Почему они не взлетели? Что еще ты видел на своем 12-летнем веку верстальщика? Что казалось перспективным, но со временем отжило? Интересно было бы такое узнать)
А может еще и java апплеты разобрать, которые в свое время считались неимоверной крутотенью на страничке? )))
Благодарю!! Круто!!
як завжди топ 🤟🤟🤟
Wow! Контент как по заказу! +100500 лайков!
Спасибо!
Очень помогло, спасибо
Спасибо за ролик!
Пожалуйста!