No video

Классный эффект наведения с HAS NOT псевдоклассами

  Рет қаралды 4,068

WebDev с нуля. Канал Алекса Лущенко

WebDev с нуля. Канал Алекса Лущенко

Күн бұрын

iTGid.info - курсы Алекса Лущенко
🪬 Курс JavaScript 24/2 : itgid.info/ru/...
👑 Курс JavaScript 24/1 : itgid.info/ru/...
🫶 Поблагодарить автора - монобанк: 5375414126666006 Лущенко О
🍹 Задонатить - www.buymeacoff...
✈️ Задать вопрос через телеграм: telegram.me/it...
Курсы автора:
ReactJS: itgid.info/ru/...
Методы массивов: itgid.info/ru/...
Канал ru: / itgid
Канал UA: / @itgidua-web7836

Пікірлер: 23
@ihopeingod1
@ihopeingod1 Ай бұрын
Алекс, вы самый лучший преподаватель. Спасибо вам большое за ваши уроки!
@Andrii-y3z
@Andrii-y3z Ай бұрын
Испытал два варианта с :has и традиционный. Делал не смотря на код видео только картинки использовал. Так отметил что традиционный вариант без :has и :not оказался сложней так как 1. Нужно точно знать и соблюдать вес селекторов а это будет всегда проблемой в css для тех кто ни каждый день имеет дело с вёрсткой 2. Селектор назначения свойства и селектор отмены свойства может быть в программе в разных местах что усложняет отладку кода. У примера c использованием :has таких проблем нет.
@Andrii-y3z
@Andrii-y3z Ай бұрын
&:has(img:hover) { & img:not(:hover) { opacity: 0.5; filter: grayscale(100%); } & img:hover { border-radius: 40px 0 40px 0; overflow: hidden; } }
@bjiastx
@bjiastx Ай бұрын
.images:hover img:not(:hover) 2 вариант в 1 строку
@frosya10
@frosya10 Ай бұрын
😊 все здається наче добре поки до мобільної верстки не дійшло. От тоді ці всі hover вилазять боком.
@leonidilinskiy8180
@leonidilinskiy8180 Ай бұрын
видео полезное, для меня это новая инфа, спасибо однако это второе видео которое смотрю на вашем канале и убедительно прошу: соблюдайте чистоту кода при написании стилей, избегайте прописывания тегов и сильного увеличения веса селекторов, используйте классы, не плодите верстальщиков которых будут унижать тимлиды на ревью в продуктовой верстке, если бы вы мне такой код прислали на ревью я бы вас заставил рефачить весь файл стилей. не надо так. еще раз видео полезное, большое спасибо за вашу работу
@Andrii-y3z
@Andrii-y3z Ай бұрын
У меня такая идея возникла. CSS уже поддерживает вложенность селекторов. Та я думаю что Можно уже и частично отказаться от БЕМ. Давать уникальный имена классов только тем 'блокам' или 'компонентам', кому как угодно, которые являются основными. Например в данном видео дат уникальное название только контейнеру блока в который вложены все фото, а остальным обращаться по тегу Например: .uniq_name_container_images_alexander { & img { width: 100%; /*...*/ &:hover { /*...*/ } } / *...*/ }
@leonidilinskiy8180
@leonidilinskiy8180 Ай бұрын
@@Andrii-y3z такой подход верен только в случае если ты уверен что в конкретно данном блоке любой данный тег будет содержать один стиль единый для всех да и в любом случае это не совсем корректно и дело тут не в бэм а в простой читаемости и поддерживаемости, потому я все равно настоятельно рекомендую работать с классами
@Andrii-y3z
@Andrii-y3z 18 күн бұрын
@@leonidilinskiy8180 Да вы правы. Узнал про алгоритм поиска сложных селекторов они к моему удивлению читаются с права на лево , то есть если есть такой селектор .class1 class2 a то сначала найдутся все эл. 'a' затем выборка будет сделана по class2 а затем уже .class1 . У баз данных вроде также работает алгоритм . Если не так то поправьте меня.
@stanf5488
@stanf5488 Ай бұрын
Вопрос не в тему. Картинки для этого видео были сгенерированы через ИИ и занимают пол-экрана. Будет ли Ютуб считать такие видео как ИИ сгенерированные, которые надо помечать знаком Ai ?
@leonidilinskiy8180
@leonidilinskiy8180 Ай бұрын
твой хелпер для VS code умеет без copilota мультиэлементы создавать достаточно в конце добавить *n где n это количество элементов которое тебе нужно, не благодари
@itgid
@itgid Ай бұрын
Те вы хотите сказать, что еммет может сгенерировать png изображения, которые выводятся на страницу по промту? Ведь я просил сопилот именно это сделать.
@leonidilinskiy8180
@leonidilinskiy8180 Ай бұрын
@@itgid адреса изображений он не проставит, я говорил про множественное создание тегов, вы же в видео делали их копипастой, и сказали об этом, хотя момент спорный я бы скорее всего просто расклонировал тег с уже просталенным атрибутом и поменял тупо числа как это сделали вы) copilot я в работе не использую не могу про его возможности рассуждать
@BROnik
@BROnik Ай бұрын
как всегда 🔥
@alenache1
@alenache1 Ай бұрын
@skitwashere
@skitwashere Ай бұрын
Подавайте українською!
@itgid
@itgid Ай бұрын
kzfaq.info/get/bejne/feCaa7mWr9SpiIk.html
@skitwashere
@skitwashere Ай бұрын
@@itgid Підписався.
@boycovclub
@boycovclub Ай бұрын
Автор курсов сам знает, что ему делать без джунов. благодарю Вас Александр за курсы. Мною было куплены около 5 курсов ваших в 2019 году и я уже более 4 лет работаю удаленно. Спасибо за ваши труды
@m_mariya_mari
@m_mariya_mari Ай бұрын
А ви не розумiете?
@mdwebfront-end655
@mdwebfront-end655 Ай бұрын
has не підтримується у firefox тому треба писати @support(:has)
@user-wj4pc7te1j
@user-wj4pc7te1j Ай бұрын
А теперь скажи это всё на нормальном, человеческом языке.
@user-ne2fm4uq7r
@user-ne2fm4uq7r Ай бұрын
@@user-wj4pc7te1j все языки для общения людей между собой человеческие держу в курсе, если ты его не понимаешь это не делает его не человеческим
Анимация вертикальной прокрутки за 10 строк кода CSS: view, entry
10:20
WebDev с нуля. Канал Алекса Лущенко
Рет қаралды 1,8 М.
HTTP запросы - GET, POST, PUT... Работаем с Postman
39:33
WebDev с нуля. Канал Алекса Лущенко
Рет қаралды 3,2 М.
7 Days Stranded In A Cave
17:59
MrBeast
Рет қаралды 93 МЛН
Happy birthday to you by Tsuriki Show
00:12
Tsuriki Show
Рет қаралды 11 МЛН
WILL IT BURST?
00:31
Natan por Aí
Рет қаралды 18 МЛН
Налог на незнание JavaScript - [Hamster Kombat]
50:20
7 Days Stranded In A Cave
17:59
MrBeast
Рет қаралды 93 МЛН