Лайк не глядя, спасибо за контент

Вы мой куратор в скиллбокс, оказывается у вас есть ютуб канал, всё чётко и понятно снимаете, однозначно лайк)

Нужно было сделать бегущую строку с логотипами, с Вашей реализацией возникли трудности, вернее она работает некорректно. Все дети флекс-родителя смещались на 100%, а дальше пустое пространство, которое оставляет за собой последний флекс-ребенок и рывок, с которым дети возвращаются на свои места и анимация перезапускается. Прежде всего, можно использовать и translateX prop, т.к. у нас смещение по одной оси Х. Решение: флекс-дети оборачиваются в дополнительный флекс-контейнер, которому задается тикер-анимация. Контейнер верхнего уровня служит только для сокрытия переполнения. А дальше с пом. js получаем ссылку на флекс с детьми, клонируем его и вставляем в контейнер вверхнего уровня. В результате вместо разрыва после последнего эл-та у нас анимируется склонированая нода, и к завершению анимации клона, основная нода возвращается на место и анимашка перезапускается. Для адаптивности заводим 2 css variables: 1 - кол-во всех элементов, 2 - кол-во отображаемых на странице => флексу высчитываем ширину в процентах на основании этих данных; ширина = 100% / эл-тов на экране * всего эл-тов А там через медиа жонглируем кол-вом отображаемых на странице. Надеюсь кому-то помог.

Ну наконец то нашел то, что надо! И очень просто... Спасибо!

Прикольно) лайк и коммент

к сожалению этот способ рабочий если текст, как в примере, у нас одинаковый. но если к примеру у нас там крутится совсем разный текст - идет рассинхрон в анимации, из-за того что ширина блоков разная

круто красавчик молодец)

spasibo ot duwi pomoq 😀👍

Максим, спасибо за видео. Не хватает подробностей, почему именно translateZ, translate3d, почему именно такие числовые значения. Ещё хотелось бы увидеть, как именно в анимации блок с текстом движется по кругу, например, в небольшом родительском блоке, чтобы было видно, когда он выпадает за края родителя. Это помогло бы понять принцип работы, а не только копировать из видео код.

👍🏻👍🏻👍🏻

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

Макс, благодарю за твои ролики! Скажи пожалуйста, на какую CMS кроме вордпресса можно залить работы по твоим урокам, что посоветуешь из Топ 3 для тебя?

вот только если длинна текста бдет разная єтот вариант не подойдет

у меня этот список создается в отдельном окне при каждом запуске скрипта пайтон через джаву проверяется помещается ли он в размеры если нет то начинает крутится как мне оптимизировать его под это ?

Если текст разной длины, то засуньте каждый элемент текста в отдельный тег и их все .ticker__item, а .ticker__item продублируйте и будет заебись

Решение не сработало на тексте, ширина которого больше ширины экрана =(

Макс здраствуйте спасибо за видео, у меня вопрос созрел, могу ли я изучать фронтенд но при этом и c#, очень так зашло. Просто в колледже изучаем си шарп и базы данных, но фронт мне больше по душе, хоть там и тоже встречаются элементы веб апи. Если можете сказать, то стоит ли учить фронт вместе с си шарпом?

Привет, можешь показать как реализовать инпунт с скрытым поиском. Есть плагин select2, но у него поиск реализован отдельной строкой, а сейчас в тренде чтоб поиск производился внутри самого инпута, и в идеале как заполнять список выбора с помощью ajax

Почему это видео не вышло когда я делал тестовое задание в одну компанию где нужно данную штуку сделать эх, хоть щас буду знать, довольно часто вижу её на сайтах

А с картинками также будет работать?

а если мне надо по вертикали сделать

такое часто бывает... в 2000ом году

Привет! А как сделать то же самое, но с картинками?

Звук очень очень тихий