Бро, ставлю лайк за такую работу. Все понятно объясняешь и разжевываешь. Спасибо!

@SuprunAlexey

4 жыл бұрын

Спасибо большое

8:22 Может я что-то не уловил, но, что мешало повесить :hover на сам блок? .stepblock:hover .stepinfolast { border-color: #fff; } Но, даже если предположить, что скрипт нужен, то почему он переопределяет всё свойство border, когда можно указывать только border-color? Плюс так при mouseout вообще не пришлось бы задавать какой-либо цвет, а просто обнулять ранее указанный стиль. И почему скрипт дублируется для каждого id? А если добавят ещё один блок? Он не будет работать. А если удалят один блок? Будет ошибка. Нужно просто «прицепить» скрипт к блоку-обёртке, и чтобы он циклом проходил по всем элементам. Код от этого станет только проще, имхо. Даже для начинающих. upd: Кто-то внизу об этом уже писал ранее...

@hegde872

4 жыл бұрын

Спасибо. У меня пропало желание делать этот макет с этим недоверстальщиком.

вот когда ты закоментировал а потом раскоментировал вообще отлично ! такой формат просто супер!

3 части за один день - мощно

@SuprunAlexey

4 жыл бұрын

Зато на выходных не было

Большое спасибо! Интересно было узнать об использовании JS на практике. Начинающим будет полезно

8:18 Потому что надо делать .stepblock:hover .stepinfolast{ ... } А про то, насколько коряво был создан js-код лучше и не начинать...

@xenm85

3 жыл бұрын

Зашел сюда только, что бы написать подобный комментарий. JS код автору лучше не писать вообще

Спасибо! Все получилось без проблем) А можно еще где-то применить JS на этом макете для примера?

Чтобы при ховер-эффекте менялся цвет текста блока и полосы внизу js совсем не нужен. Полоса, сделанная через псевдоэлемент :after также легко меняет цвет обычными правилами css. JS, имхо, тут и в другом макете был бы интересен при создании скроллинга страницы. Также непонятно, зачем нужно было нумеровать блоки: 1, 2, 3. Они абсолютно идентичные. Достаточно было бы применить класс для всех трех блоков. Кстати, ИМХО, тогда и в этом ненужном js-коде не пришлось бы писать лишний код.

@user-sr3wl9tf2l

2 жыл бұрын

Через псевдоэлемент - нет, я так понимаю, автор хотел показать применение JS при создании сайта, а получение по классу конечно бы упростило код.

Спасибо мэн ты лучший!

Спасибо большое за видео. А не лучше ставить максимальную ширену вместо br?

WDB: Давайте тогда не будем томить, перейдём сразу от слов к делу Реклама: Позвольте представиться

Выбрасываем все id. вместо получать по id получаем по классу и не нужно три раза одинаковый скрипт писать - как то так: let stpbl1 = document.getElementsByClassName("stepblock"); let stpbrdr1 = document.getElementByClassName("stepinfolast"); stepbl1.onmouseover = function() { stpbrdr1.style.borderBottom = "3px solid white"; } stpbl1.onmouseout = function() { stpbrdr1.style.borderBottom = "3px solid black"; }

А где нужные файлы к макету?

Не понимаю где я ошибся(хелп) uncaught TypeError:Cannot set property ‘onmouseover’ of null

@yarik7432

4 жыл бұрын

не думаю что тебе эта информация все еще нужна, в файле html вызов скрипта с путем файла js перекинь с верху на низ, перед закрытием тега body, не после.

С таким js в джуны не берут)) А если бы у тебя было 100 блоков.....

@SuprunAlexey

4 жыл бұрын

У нас сколько блоков? Нужно было добавить js в курс. Надо было б, сделали бы просто .stepblock:hover stepinfolast{border-bottom: 3px solid #fff;}

@daniilfrolov2137

4 жыл бұрын

@@SuprunAlexey Можно было бы замутить какой-нибудь слайдер, например)

Кода многовато, оптимальнее было бы получить массивом и в цикле перебрать, а так в целом видосик годный)

@indigolight6007

4 жыл бұрын

он здесь рассказывает для новичком. я например не понял как сделать то , что ты сказал. но все понял ,что рассказал автор видео-курса. не нравится - сделай сам , и скинь сюда ссылку, посмотрим-заценим

опа первый)

@SuprunAlexey

4 жыл бұрын

Красава, лайк

Можно было сделать через querySelectorAll

@SuprunAlexey

4 жыл бұрын

Сделайте

Оптимальный код(нет)