Крутой анимированный фон для сайта | Vanta.js
Переглядів 51,893
4 роки томуВ этом видео вы узнаете как создать очень крутой анимированный фон на вашем сайте. В этом нам поможет скрипт vanta.js
// Ссылки =================
Vanta.js: www.vantajs.com/
Материалы урока: files.brainscloud.ru/file/kru...
// О проекте =================
Меня зовут Дмитрий Валак. Я занимаюсь разработкой сайтов уже много лет, специализируюсь больше на front-end разработке и верстке сайтов, но и программирование тоже изучаю. Здесь буду делиться с вами информацией на разные темы по веб-разрабокте - HTML, CSS, Javascript, JQuery, Vue, PHP, MySQL, React, Gulp и тд.
На сайте проекта brainscloud.ru вы найдете много полезных закрытых материалов, а так же сможете поработать со мной лично, при наличии такого желания.
// Соц. сети =================
Мой ВК - odimaz
Группа BC - brainscloud
Мой Instagram: / dmitryvalak
@eutolm 4 роки тому
Дима, спасибо! Как всегда всё отлично!
@andreivoodoo4280 4 роки тому
Отличная находка.Обязательно нужно попробовать ). Благодарю за видео.
@progerlife6690 4 роки тому
всегда говорил и буду говорить что Валак Дима лучший! Лайк)
@iDobroslavin 4 роки тому
Дмитрий, спасибо, что познакомили меня работе с gulp, npm и brackets. Уже 2 года прошло, а я Вам благодарен.
@BrainsCloud 4 роки тому
На здоровье )
@PD-ih2mo 4 роки тому
Спасибо большое! Благодаря Вашим урокам делаю себе сайт. Уже в процессе натягивания на October. Хотел на главной странице поставить фоном видео облаков, а тут ещё интереснее.
@PD-ih2mo 4 роки тому
Пробовал заменить на Вашем уроке с Mogo титульную картинку на фон с облаками. Результат просто белый фон... ( Что то упускаю...
@user-eo4rp8fd8n 4 роки тому
Дима привет, спасибо тебе за классный background )
@aleksey7386 4 роки тому
Спасибо! Как всегда лайк!
@Tetragonchik 4 роки тому
Хорошо что вы предупреждаете о тяжести скрипта. Респект.
@drewizaiah4030 2 роки тому
Pro tip : you can watch series at Flixzone. Me and my gf have been using them for watching a lot of movies lately.
@hankemory5883 2 роки тому
@Drew Izaiah Definitely, I have been using Flixzone for since november myself :D
@user-oc5zg6mq7l 2 роки тому
Все эти супер готовые скрипты тяжелые ) Мне честно не нравится эти анимации на сайте, главное чтобы сайт был быстрым и красивым. Все!
@khalilmutallibov 3 роки тому
Большое спасибо за урок! К сожалению пришлось убрать данный фон с сайта, так как сам сайт был очень тяжелый, а с этим так вообще сервер сдыхает. Но сами обои огонь!
@ladyafize5689 4 роки тому
Спасибо большое 🔥🔥🔥🔥🔥
@r0_f0 4 роки тому
A good video and great explanation
@RosarioPorello 4 роки тому
Лайк со старта !)
@orangelemon7991 4 роки тому
Спасибо автору канала за видео
@user-jx7lr9nj8m 3 роки тому
Спасибо, прям то что искал и не находил 2 дня😅
@Mykhailo_Vdovychenko 4 роки тому
Спасибо за чудесный урок, было очень интересно работать со скриптом! =)
@DeIgado95 4 роки тому
последние месяцы занимаюсь изучением вэба и неоднократно замечал уже ваши комментарии под разными видео от разных авторов по вёрстке\фронтэнду) Всё-таки не могу удержаться и спрошу - как ваши успехи в освоении этой сферы?)
@Mykhailo_Vdovychenko 4 роки тому
@@DeIgado95 изучать начал в прошлом году. Тогда верстать норм мог только по урокам, а JS или слайдера так вообще боялся. Сейчас уверенно могу сверстать любой сложности макет без всяких проблем. + начал понимать суть кода JS, хотя большинство вопросов решаю поиском в гугле куска кода и редактированием под свои нужды. Начинал с уроков Гоши Дударя, IT Doctor, потом очень крепко был подсел на уроки Дмитрия Валака и на канал "от 0 до 1". Реально эти ребята умеют научить и знают как объяснить сложные вещи простыми словами. Раньше пробовал разные направления, но в итоге остановился именно на front-end'e. Сейчас пересматриваю уроки Дмитрия Валака, потому что мне очень нравится его вёрстка, построение кода и эстетика в написании. Как Ваши успехи? Как впечатления от данного ремесла?
@DeIgado95 4 роки тому
@@Mykhailo_Vdovychenko вот да, как раз на этих каналах видал вас) По поводу Дмитрия соглашусь, этот канал в фаворитах. Сам я на начале этого пути) Пару месяцев занимаюсь, сейчас что-то на уровне Эктив Бокса сам могу сверстать, ну и интерактив какой-то прикрутить(но готовый - типо слайдера слик). Вообще питаю надежды, что за год получится доучиться до уровня, который позволить хотя бы пробовать начать ходить на собеседования. А вы уже пробовали как-то монетизировать данное дело\устроиться куда-то?
@Mykhailo_Vdovychenko 4 роки тому
@@DeIgado95 так это вполне хороший результат, в таком темпе то за год без проблем пройдёте собеседование. Я пока никуда не пробовался, так как в моем населённом пункте нету IT-компаний, нужно ехать в Киев. Пока ищу варианты с удалённой работой. Но думаю без проблем бы прошёл на Junior на 300-400$ в мес. Успехов Вам в изучении столь сложного, но ооочень интересного дела!
@DeIgado95 4 роки тому
@@Mykhailo_Vdovychenko вам тоже успехов в развитии. А что за город, если не тайна? Сам с Харькова просто, у нас вроде что-то найти можно вполне
@Lollol-ss9yd 3 роки тому
Больше интересно, как самому делать подобные штуки:)
@Yakyzzza93 3 роки тому
действительно круто) и да, железо норм так подгружает на слабеньких компах.
@VenomRLM 4 роки тому
I leave here a thanks from a good Friend !
@user-xz6iz4gj5c 4 роки тому
Круто!
@turalperfectworld1065 4 роки тому
Лайк не глядя.
@lawdriver88 Рік тому
Спасибо
@oleksandrkovalenko7033 4 роки тому
Привет Запиши пожалуйста видео по оптимизации сайта для Google PageSpeed Insight, на Wordpress или Opencart
@alekseyyakovlev3897 Рік тому
Добрый день! А не подскажите, ка допустим использовать одну тему для светлого оформления сайта, а другую для темного? Я имею ввиду, как сделать переключение темы с помощью ползунка, допустим?)
@fantast2568 4 роки тому
спасибо
@designerfreud 4 роки тому
Уроки одни из самых лучших на ютубе, одно удовольствие смотреть ваши видеоуроки P.S. vanta js накрылся((
@DeIgado95 4 роки тому
состоянием на май 2020 всё отлично работает
@baton4iki 3 роки тому
все гуд работате
@worldxxgtd2643 Рік тому
решили проблему?
@shoxd8926 4 роки тому
Почему то js файл не хочет читать скрипт (el: #...) постоянно дает error на этой линии. Будто, js не знает что такое el. Использую я Sublime Text
@rishikshrivastav1978 4 роки тому
It helps a lot. But plz add atleast subtitles in your next video.
@nametyshev84 2 роки тому
А для каких сайтов подходят эти шаблоны? Подскажите пожалуйста я новичок!
@tyhpX 2 роки тому
подскажи пожалуйста как поверх этого фона добавить меню?
@nndryx 3 роки тому
Спасибо долго искал. 1:10 я один делаю сайт на телефоне?
@user-qj3ng6uc1u 2 роки тому
Интересно как написать такой скрипт самому на чистом js?
@ShClub317 3 роки тому
Автор, отзовитесь пожалуйста на мой вопрос! Возможно ли настроить работу фона так, что бы для тех кто заходит на сайт со слабым устройством, то анимация для них не работала? Но для тех у кого мощное железо, то анимация работала? Возможно сделать так, чтоб система видела скорость сигнала входящего трафика и автоматически с заданным порогом скорости сигнала, подстроивалась под него свою работу(показать анимацию фона или нет)?
@Mykhailo_Vdovychenko 4 роки тому
RTX 2060 на 40% грузится :D
@user-uu1rf1vl6k Рік тому
А как поверх этого фона все остальное накинуть?
@alex-ns7bg 2 роки тому
я так понимаю если открывать локальный сайт ( file:///D: ...) то не будет работать такой фон. а как сделать чтоб заработал помогите пж
@rishikshrivastav1978 4 роки тому
I don't understand your language. But i understand it.
@alistenkurut 3 роки тому
so cool
@user-wn6gc1iw6m 11 місяців тому
Добавил скрипт. Wordpress. А как вывести его на сайт?)
@user-mb8jm6lu5t Рік тому
Интересно как этот код вставить в тильду
@user-pc4ke5xg5p 3 роки тому
В файле app.js в самой 1 строке вылазит ошибка eror vanta is not defined .Что делать?
@warpoint2 3 роки тому
вот вот тот же вопрос
@demchyshynsasha6786 Рік тому
@@warpoint2 изменить порядок подключения скриптов в html
@demchyshynsasha6786 Рік тому
изменить порядок подключения скриптов в html
@user-sh3yk8mo5h 4 роки тому
Возникла проблема. Загрузил все как у вас, но выдает ошибку, что не может найти нужный id. В чем проблема
@alex-ns7bg 2 роки тому
привет, ты решил проблему? можешь подсказать пожалуйста
@warpoint2 3 роки тому
Ругается что VANTA не определена... где её нужно определить ?
@demchyshynsasha6786 Рік тому
изменить порядок подключения скриптов в html
@madishman4861 2 роки тому
ERROR: 'VANTA' is not defined - что делать?
@demchyshynsasha6786 Рік тому
изменить порядок подключения скриптов в html
@worldxxgtd2643 Рік тому
@@demchyshynsasha6786 как
@demchyshynsasha6786 Рік тому
@@worldxxgtd2643 вот в таком порядке должны быть подключены скрипты, потому что в первом скрипте эта VANTA объявляется
@orangelemon7991 4 роки тому
Где лучше всего учить JS? Какие книги читать?
@cars_owners 4 роки тому
Вы сперва определитесь для чего вам нужен яп, а потом уже выбирайте. Ведь может будет лучше изуть другой язык, а не js
@orangelemon7991 4 роки тому
@@cars_owners для веба. Посоветуете что то годное?
@orangelemon7991 4 роки тому
@@nisto589 Спасибо.😊
@user-tj7jg5pq5o 4 роки тому
Лучше всего читать Play Boy.
@Tetragonchik 4 роки тому
@@user-tj7jg5pq5o не, Playboy лучше смотреть :)
@MS_industrys 2 роки тому
У меня не работает (просто белый фон)
@alex-ns7bg 2 роки тому
привет, ты решил проблему? можешь подсказать пожалуйста
@Nataliia-bp1py 2 роки тому
@@alex-ns7bg привет! у меня получилось, в скрипты вместо сохраненных файлов js вставила ссылки из директории
@nndryx 3 роки тому
У меня не работает
@kotya7892 3 роки тому
Разобрался?
@nndryx 3 роки тому
@@kotya7892 нет
@alex-ns7bg 2 роки тому
привет, ты решил проблему? можешь подсказать пожалуйста
@nndryx 2 роки тому
@@alex-ns7bg не помню, вроде да, а у тебя что?
@mind7982 2 роки тому
@@alex-ns7bg используй сайты для проверки своего кода
Ветерани космічних військ
Переглядів 535 тис.
Давай Попробуем: JavaScript
Переглядів 8 тис.
IT at MISIS
Переглядів 10 тис.
Max Shirko / Design Inspiration
Переглядів 25 тис.
MaxGraph - cайты как страсть
Переглядів 28 тис.