Создание сетки в Figma
16:54
Пікірлер
@MikaStan
@MikaStan 6 сағат бұрын
Как интерфейс на русский язык переключить? не понял так и.
@wdm
@wdm 3 сағат бұрын
Установить расширение «Russian Language Pack for Visual Studio Code»
@APPKG
@APPKG Күн бұрын
Раньше я работал в сублайм тексте когда заходил вскод мне ваше не понятно бло все английский был когда изменил язык на русском всё бло понятно 😊
@user-xy3er2vk7r
@user-xy3er2vk7r Күн бұрын
Подскажите, пожалуйста, название темы для ОС
@Nikitosina_vnature
@Nikitosina_vnature 5 күн бұрын
Громадная работа, только уважение. Скажите хочу создать интернет магазин обуви, только начал изучать фигму, хочу сделать все сам, но нужен наставник, как и где я могу получить какую либо помощь! Буду очень благодарен за какой либо совет!
@wdm
@wdm 5 күн бұрын
Здравствуйте. Без проблем, спрашивайте)
@Nikitosina_vnature
@Nikitosina_vnature 3 күн бұрын
@@wdm я могу добавить фото и анимацию на этапе верстки магазина, или это делается на этапе макета в фигме?
@wdm
@wdm 3 күн бұрын
Обычно в команде это делается по установленному протоколу. Если вы сами разрабатываете - как удобно.
@user-oc3yy2vq8e
@user-oc3yy2vq8e 7 күн бұрын
А можно сделать так, что бы при открытии сайта эти картинки сами скролились. Типа что бы как видео получилось
@wdm
@wdm 7 күн бұрын
Есть несколько вариантов. 1. Простой. Включить autoplay, добавив к существующим параметрам эти: autoplay: { delay: 1000 }, loop: true, 2. Посложнее. Будет просто бесконечное движение. 2.1 Необходимо подключить библиотеку версии 4.0.7: cdnjs.cloudflare.com/ajax/libs/Swiper/4.0.7/js/swiper.min.js 2.2 Применяем эти параметры в JS: new Swiper('.slider', { parallax: true, spaceBetween: 18, loop: true, freeMode: true, autoplay: { delay: 0, disableOnInteraction: false, }, speed: 10000 }) 2.3 Добавляем в конец CSS файла: .swiper-container-free-mode > .swiper-wrapper{ transition-timing-function : linear; }
@bunX0928
@bunX0928 12 күн бұрын
Как получить все коды сразу?
@vovan454
@vovan454 14 күн бұрын
Какое расширение он использует для того чтоб работал swiper ???? Помогите пожалуйста
@wdm
@wdm 14 күн бұрын
Какое расширение?
@vovan454
@vovan454 14 күн бұрын
​@@wdmпросто у меня почему то не свайпается на другой слайд
@wdm
@wdm 14 күн бұрын
У вас опечатка. Проверьте наличие библиотеки в libs и корректность подключения. Если в готовом примере работает, значит у вас опечатка или плагин некорректно подключен.
@vovan454
@vovan454 14 күн бұрын
@@wdm спасибо, у меня все работает, я просто забыл библиотеку
@user-cg4gk6vk5q
@user-cg4gk6vk5q 15 күн бұрын
Замечательный курс спасибо! Возникла накладка с pencil vet 3.1.1. Temlate предложенный автором не устанавливается. Было бы здорово этот вопрос решить а так велом очень полезный курс Автору большое спасибо!
@wdm
@wdm 6 күн бұрын
Здравствуйте. Стабильная версия программы 3.1.0 на странице урока.
@Anastasia-if3bi
@Anastasia-if3bi 16 күн бұрын
Огромное спасибо за такую ценную работу!!! Все объясняется очень доступно и понятно!!! Мне очень нравится учиться именно по вашим видео!!! Они ❤‍🔥❤‍🔥❤‍🔥🔥🔥🔥
@alexandr-v
@alexandr-v 17 күн бұрын
За стилизацию swiper спасибо.
@user-md8lf4wc7d
@user-md8lf4wc7d 18 күн бұрын
Как ти сделал такой vs code
@wdm
@wdm 18 күн бұрын
В папке User создаём custom.css и в нём стилизуем интерфейс как удобно. Можно использовать DevTools в пункте меню Help, чтобы посмотреть DOM.
@user-md8lf4wc7d
@user-md8lf4wc7d 17 күн бұрын
@@wdm ти етот шедевр сам сделал
@wdm
@wdm 17 күн бұрын
Ну, VS Code - это по сути та же веб-страничка, можно оформить как хочешь 😄
@user-md8lf4wc7d
@user-md8lf4wc7d 17 күн бұрын
@@wdm круто я не знал што так можно, один вопрос сколько ти занимаешся програмированиям(веб) и кто ти такой ти правда крут
@wdm
@wdm 17 күн бұрын
С 2005 года.
@septorlive6953
@septorlive6953 18 күн бұрын
Просто лучший из лучших
@user-sr2hz3hj2m
@user-sr2hz3hj2m 19 күн бұрын
как мы напишем это все😤
@wdm
@wdm 19 күн бұрын
Ручками ☝️
@EvgeniyYatsenko
@EvgeniyYatsenko 19 күн бұрын
шикарный урок!
@alexandr-v
@alexandr-v 20 күн бұрын
Наконец-то узнал как можно выбрать предыдущий элемент.
@b4r1sta
@b4r1sta 21 күн бұрын
lorem комментарий во благо, this very good work
@oopssorry.7221
@oopssorry.7221 21 күн бұрын
Мужик, ты реально мегамозг! Все доходчиво, интересно, с объяснениями. Очень благодарен тебе, просто лучший!
@Barsi.77
@Barsi.77 23 күн бұрын
Респект ! Так классно все объясняет и показывает!
@batskalevich
@batskalevich 23 күн бұрын
Подскажите, есть ли какие-то решения, если на фон нужно вставить видео с альфа-каналом, чтобы была возможность работать с бэкграундом?
@wdm
@wdm 23 күн бұрын
Нет, только стилизация видео в редакторе под окружение в сцене.
@WockeezChannel
@WockeezChannel 28 күн бұрын
Можно ли вырезать media запросы и вынести в отдельный файл?
@wdm
@wdm 28 күн бұрын
Без проблем. Просто удобно работать именно в том селекторе, который стилизуем и с медиазапросами. В файле, который будет выделен для медиа-запросов придется повторять всю цепочку селекторов.
@WockeezChannel
@WockeezChannel 27 күн бұрын
@@wdm какие для этого плагины нужно использовать? Нужно скомбинировать все медиа запросы и их вставить в отдельный файл под названием media.css, а остальные стили в style.css.
@wdm
@wdm 27 күн бұрын
Плагины не нужны. Если используете препроцессор, реализацию и боейкпоинты можно посмотреть здесь: github.com/agragregra/start_html/blob/master/_optimized_gulp_sass/sass/_media.sass
@wdm
@wdm 27 күн бұрын
Если без препроцессора, то вот пример: github.com/agragregra/Simple-Starter/blob/main/css/media.css
@ava_crey
@ava_crey 28 күн бұрын
Можете помочь, мне в терминале пишет Error opening input: No such file or directory Error opening input file background-60.mp4. Error opening input files: No such file or directory, когда я вставляю команду которая есть в папке, как решить?
@wdm
@wdm 28 күн бұрын
А терминал в какой папке запущен? Его нужно запустить в той папке, где есть этот файл.
@ava_crey
@ava_crey 28 күн бұрын
@@wdm терминалу дал путь именно как у вас C:\Program Files\ffmpeg\bin у меня все запущен но, видео не читает и я не понимаю как, хотя сделал так как вы показали но, у вас видео название такой background-60.mp4 а у меня background-60, но я не знаю насколько это влияет. Можете что нибудь посоветовать?
@wdm
@wdm 28 күн бұрын
В настройках папки следует включить отображение расширений файлов, если оно отключено. Там в папке нужно найти настройки и отключить галочку "скрывать расширения". После этого обязательно нужно убедиться, что открыта именно та папка, в которой есть "background-60.mp4", вместе с расширением .mp4. В этой папке нужно запустить правой кнопкой мыши терминал и выполнить команду конвертации.
@ava_crey
@ava_crey 28 күн бұрын
​​@@wdmА у вас Виндовс или Линукс? Ну я сделал как вы написали, ну так: нашли "скрывать расширений" и убрали галочку и сразу рядом background-60 появился слово .mp4 но все равно дает ошибку. Я не могу открыть терминал именно в папке, я открываю терминал с Win+R и пишу CMD и там написано C:\Users\abdul> и вставляю вашу команду, то есть вот так выходит: C:\Users\abdul> ffmpeg -i background-60.mp4 -vf scale=1920:-1 -movflags faststart -vcodec libx264 -crf 20 -g 1 -pix_fmt yuv420p background.mp4 и нажимаю Энтер и выходит ошибка. У меня Windows может поэтому у меня проблема
@wdm
@wdm 28 күн бұрын
Нужно открыть терминал именно в папке. Зажмите Shift, правая кнопка мыши и появится нужный пункт. У меня Windows.
@latest548
@latest548 28 күн бұрын
Спасибо за урок очень полезный
@vestflx
@vestflx 29 күн бұрын
как скачать HTML и CSS?
@wdm
@wdm 29 күн бұрын
На странице урока, ссылка в описании.
@YutaLoo
@YutaLoo Ай бұрын
А можете, красивый профиль показать как сделать)
@YutaLoo
@YutaLoo Ай бұрын
А можете сделать музыкальный плеер)
@SvirkoSam
@SvirkoSam Ай бұрын
Спасибо за урок! Просто годнота ❤
@YutaLoo
@YutaLoo Ай бұрын
Очень круто, все объясняется, просто шикарно. А как после скрола добавить ещё
@wdm
@wdm Ай бұрын
Просто размещаете контент дальше, а там можете и анимацию перехода какую-нибудь сделать.
@lernikharutyunyan604
@lernikharutyunyan604 Ай бұрын
👍 гениально!
@cout09
@cout09 Ай бұрын
Can we get english subtitles? Ireally loved your work?
@7life720
@7life720 Ай бұрын
Крутой урок. Один вопрос, зачем мы использовали тег <span> для переноса части текста, если можно использовать тег <br>?
@wdm
@wdm Ай бұрын
Обертку части текста можно выполнить на фронтенде, либо с помощью регулярных выражений, либо по количеству слов. Тег br же нужно будет вводить пользователю через систему управления контентом вручную. Однако не рекомендую давать пользователю хоть какие-нибудь инструменты дизайна. Если использовать br, придется писать более сложное выражение для автоматической разбивки Поэтому как показывает практика, проще и лучше обернуть в span.
@andreys3346
@andreys3346 Ай бұрын
Смотивировал меня поверстать. 👍
@GEELSRC
@GEELSRC Ай бұрын
Это мой лучший канал по фронтенду, сам бекендер но с удовольствием смотрю видео с этого канала, автору респект !
@lvovich_biz
@lvovich_biz Ай бұрын
А где найти код такой: на десктопной версии на главном экране одно изображение, а когда мобильная версия, то изображение меняется на другое?
@wdm
@wdm Ай бұрын
Можно создать инлайновый тег style, в который загружать переменные, в зависимости от медиа запросов: <style> :root { --background-1: url(image-regular.png) } @media (max-width: 300px) { :root { --background-1: url(image-small.png) } } </style> <div style="background-image: var(--particular-ad);"></div> И так для каждого слоя.
@lvovich_biz
@lvovich_biz Ай бұрын
@@wdmлучший, спасибо
@tanpii1312
@tanpii1312 Ай бұрын
спасибо за урок! как всегда очень полезно😌 вот только не очень поняла, как сделать прокрутку вниз, если у страницы есть дальнейшее содержание?
@wdm
@wdm Ай бұрын
Здравствуйте. Здесь всё просто. Мы же задаем высоту секции в vh, где происходит анимация. То есть когда анимация завершается, фактически, мы доскроллили до конца. Это значит, что дальше будет прокручиваться весь дальнейший контент. Вам просто необходимо добавить обертку для контента, указать position: relative, при необходимости подобрать z-index и верстать последующий контент, который будет прокручиваться дальше. Если внимательно посмотреть и понять урок - когда начинается, когда заканчивается анимация, как происходит привязка к скроллу, всё встанет на свое место и ответ будет на поверхности.
@ai-bloggers
@ai-bloggers Ай бұрын
пушка!!!💣💣💣
@user-sc2om5fc6b
@user-sc2om5fc6b Ай бұрын
Огромное спасибо за такой контент, где реально показывают как работать с анимацией!!! Благодарю
@blatov
@blatov 2 ай бұрын
Очень круто 👍
@lsdkkdkkd
@lsdkkdkkd 2 ай бұрын
я теперь оторваться не могу, просто двигаю мышкой и кайфую
@gudeFrontend
@gudeFrontend 2 ай бұрын
Это фантастика!
@user-ed2qr2dh7e
@user-ed2qr2dh7e 2 ай бұрын
Купил курс, решил поддержать тебя, спасибо за твои старания)
@wdm
@wdm 2 ай бұрын
Спасибо! Приятного обучения)
@Rostyslav-Kinash
@Rostyslav-Kinash 2 ай бұрын
спасибо за урок
@Rostyslav-Kinash
@Rostyslav-Kinash 2 ай бұрын
спасибо за урок
@Max_Pl78
@Max_Pl78 2 ай бұрын
Просто огонь 🔥🔥🔥!!! Возможно у Вас есть уроки, с похожим сайтом, но чтобы вверху было неподвижное меню?)))
@wdm
@wdm 2 ай бұрын
Спасибо! Навскидку не вспомню, есть или нет. Но делается это довольно легко. У полосы меню - position: fixed; top: 0; width: 100%
@user-nn9qy1yh3s
@user-nn9qy1yh3s 2 ай бұрын
еще б настроечку чтоб убрать лишние отсутп между файлом стилей где номер строки - много места пустого
@seal1315
@seal1315 2 ай бұрын
Обожаю этот канал ! Не пожалел, что взял курсы! Всё изложено четко без воды. Ставит мощную базу💪
@WebDevXpert
@WebDevXpert 2 ай бұрын
very nice design
@user-li7of6vp8u
@user-li7of6vp8u 2 ай бұрын
Просто ВАУ!!! Спасибо большое))
@user-md8lf4wc7d
@user-md8lf4wc7d 2 ай бұрын
Як ти зробив таке оформлення в vs code
@user-yc9uy5tg1n
@user-yc9uy5tg1n 2 ай бұрын
Алексей, Спасибо огромное за знания, которыми Вы с нами делитесь! 🙏
@wdm
@wdm 2 ай бұрын
💥 Все курсы в одном комплекте 👇👇👇 webdesign-master.ru/bundle_courses