No video

Крутой анимированный фон для сайта | Vanta.js

  Рет қаралды 53,059

BrainsCloud

BrainsCloud

Күн бұрын

В этом видео вы узнаете как создать очень крутой анимированный фон на вашем сайте. В этом нам поможет скрипт vanta.js
// Ссылки =================
Vanta.js: www.vantajs.com/
Материалы урока: files.brainscl...
// О проекте =================
Меня зовут Дмитрий Валак. Я занимаюсь разработкой сайтов уже много лет, специализируюсь больше на front-end разработке и верстке сайтов, но и программирование тоже изучаю. Здесь буду делиться с вами информацией на разные темы по веб-разрабокте - HTML, CSS, Javascript, JQuery, Vue, PHP, MySQL, React, Gulp и тд.
На сайте проекта brainscloud.ru вы найдете много полезных закрытых материалов, а так же сможете поработать со мной лично, при наличии такого желания.
// Соц. сети =================
Мой ВК - odimaz
Группа BC - brainsc...
Мой Instagram: / dmitryvalak

Пікірлер: 87
@Tetragonchik
@Tetragonchik 4 жыл бұрын
Хорошо что вы предупреждаете о тяжести скрипта. Респект.
@drewizaiah4030
@drewizaiah4030 3 жыл бұрын
Pro tip : you can watch series at Flixzone. Me and my gf have been using them for watching a lot of movies lately.
@hankemory5883
@hankemory5883 3 жыл бұрын
@Drew Izaiah Definitely, I have been using Flixzone for since november myself :D
@user-oc5zg6mq7l
@user-oc5zg6mq7l 2 жыл бұрын
Все эти супер готовые скрипты тяжелые ) Мне честно не нравится эти анимации на сайте, главное чтобы сайт был быстрым и красивым. Все!
@iDobroslavin
@iDobroslavin 4 жыл бұрын
Дмитрий, спасибо, что познакомили меня работе с gulp, npm и brackets. Уже 2 года прошло, а я Вам благодарен.
@BrainsCloud
@BrainsCloud 4 жыл бұрын
На здоровье )
@progerlife6690
@progerlife6690 4 жыл бұрын
всегда говорил и буду говорить что Валак Дима лучший! Лайк)
@PD-ih2mo
@PD-ih2mo 4 жыл бұрын
Спасибо большое! Благодаря Вашим урокам делаю себе сайт. Уже в процессе натягивания на October. Хотел на главной странице поставить фоном видео облаков, а тут ещё интереснее.
@PD-ih2mo
@PD-ih2mo 4 жыл бұрын
Пробовал заменить на Вашем уроке с Mogo титульную картинку на фон с облаками. Результат просто белый фон... ( Что то упускаю...
@khalilmutallibov
@khalilmutallibov 3 жыл бұрын
Большое спасибо за урок! К сожалению пришлось убрать данный фон с сайта, так как сам сайт был очень тяжелый, а с этим так вообще сервер сдыхает. Но сами обои огонь!
@Lollol-ss9yd
@Lollol-ss9yd 4 жыл бұрын
Больше интересно, как самому делать подобные штуки:)
@eutolm
@eutolm 4 жыл бұрын
Дима, спасибо! Как всегда всё отлично!
@user-uu1rf1vl6k
@user-uu1rf1vl6k Жыл бұрын
А как поверх этого фона все остальное накинуть?
@andreivoodoo4280
@andreivoodoo4280 4 жыл бұрын
Отличная находка.Обязательно нужно попробовать ). Благодарю за видео.
@shoxd8926
@shoxd8926 4 жыл бұрын
Почему то js файл не хочет читать скрипт (el: #...) постоянно дает error на этой линии. Будто, js не знает что такое el. Использую я Sublime Text
@Mykhailo_Vdovychenko
@Mykhailo_Vdovychenko 4 жыл бұрын
Спасибо за чудесный урок, было очень интересно работать со скриптом! =)
@DeIgado95
@DeIgado95 4 жыл бұрын
последние месяцы занимаюсь изучением вэба и неоднократно замечал уже ваши комментарии под разными видео от разных авторов по вёрстке\фронтэнду) Всё-таки не могу удержаться и спрошу - как ваши успехи в освоении этой сферы?)
@Mykhailo_Vdovychenko
@Mykhailo_Vdovychenko 4 жыл бұрын
@@DeIgado95 изучать начал в прошлом году. Тогда верстать норм мог только по урокам, а JS или слайдера так вообще боялся. Сейчас уверенно могу сверстать любой сложности макет без всяких проблем. + начал понимать суть кода JS, хотя большинство вопросов решаю поиском в гугле куска кода и редактированием под свои нужды. Начинал с уроков Гоши Дударя, IT Doctor, потом очень крепко был подсел на уроки Дмитрия Валака и на канал "от 0 до 1". Реально эти ребята умеют научить и знают как объяснить сложные вещи простыми словами. Раньше пробовал разные направления, но в итоге остановился именно на front-end'e. Сейчас пересматриваю уроки Дмитрия Валака, потому что мне очень нравится его вёрстка, построение кода и эстетика в написании. Как Ваши успехи? Как впечатления от данного ремесла?
@DeIgado95
@DeIgado95 4 жыл бұрын
@@Mykhailo_Vdovychenko вот да, как раз на этих каналах видал вас) По поводу Дмитрия соглашусь, этот канал в фаворитах. Сам я на начале этого пути) Пару месяцев занимаюсь, сейчас что-то на уровне Эктив Бокса сам могу сверстать, ну и интерактив какой-то прикрутить(но готовый - типо слайдера слик). Вообще питаю надежды, что за год получится доучиться до уровня, который позволить хотя бы пробовать начать ходить на собеседования. А вы уже пробовали как-то монетизировать данное дело\устроиться куда-то?
@Mykhailo_Vdovychenko
@Mykhailo_Vdovychenko 4 жыл бұрын
@@DeIgado95 так это вполне хороший результат, в таком темпе то за год без проблем пройдёте собеседование. Я пока никуда не пробовался, так как в моем населённом пункте нету IT-компаний, нужно ехать в Киев. Пока ищу варианты с удалённой работой. Но думаю без проблем бы прошёл на Junior на 300-400$ в мес. Успехов Вам в изучении столь сложного, но ооочень интересного дела!
@DeIgado95
@DeIgado95 4 жыл бұрын
@@Mykhailo_Vdovychenko вам тоже успехов в развитии. А что за город, если не тайна? Сам с Харькова просто, у нас вроде что-то найти можно вполне
@user-jx7lr9nj8m
@user-jx7lr9nj8m 3 жыл бұрын
Спасибо, прям то что искал и не находил 2 дня😅
@designerfreud
@designerfreud 4 жыл бұрын
Уроки одни из самых лучших на ютубе, одно удовольствие смотреть ваши видеоуроки P.S. vanta js накрылся((
@DeIgado95
@DeIgado95 4 жыл бұрын
состоянием на май 2020 всё отлично работает
@baton4iki
@baton4iki 4 жыл бұрын
все гуд работате
@worldxxgtd2643
@worldxxgtd2643 Жыл бұрын
решили проблему?
@aleksey7386
@aleksey7386 4 жыл бұрын
Спасибо! Как всегда лайк!
@user-eo4rp8fd8n
@user-eo4rp8fd8n 4 жыл бұрын
Дима привет, спасибо тебе за классный background )
@oleksandrkovalenko7033
@oleksandrkovalenko7033 4 жыл бұрын
Привет Запиши пожалуйста видео по оптимизации сайта для Google PageSpeed Insight, на Wordpress или Opencart
@Yakyzzza93
@Yakyzzza93 3 жыл бұрын
действительно круто) и да, железо норм так подгружает на слабеньких компах.
@alex-ns7bg
@alex-ns7bg 2 жыл бұрын
я так понимаю если открывать локальный сайт ( file:///D: ...) то не будет работать такой фон. а как сделать чтоб заработал помогите пж
@RosarioPorello
@RosarioPorello 4 жыл бұрын
Лайк со старта !)
@VenomRLM
@VenomRLM 4 жыл бұрын
I leave here a thanks from a good Friend !
@orangelemon7991
@orangelemon7991 4 жыл бұрын
Спасибо автору канала за видео
@tyhpX
@tyhpX 2 жыл бұрын
подскажи пожалуйста как поверх этого фона добавить меню?
@r0_f0
@r0_f0 4 жыл бұрын
A good video and great explanation
@user-pc4ke5xg5p
@user-pc4ke5xg5p 3 жыл бұрын
В файле app.js в самой 1 строке вылазит ошибка eror vanta is not defined .Что делать?
@warpoint2
@warpoint2 3 жыл бұрын
вот вот тот же вопрос
@demchyshynsasha6786
@demchyshynsasha6786 2 жыл бұрын
​@@warpoint2 изменить порядок подключения скриптов в html
@demchyshynsasha6786
@demchyshynsasha6786 2 жыл бұрын
изменить порядок подключения скриптов в html
@rishikshrivastav1978
@rishikshrivastav1978 4 жыл бұрын
I don't understand your language. But i understand it.
@alistenkurut
@alistenkurut 4 жыл бұрын
so cool
@user-qj3ng6uc1u
@user-qj3ng6uc1u 3 жыл бұрын
Интересно как написать такой скрипт самому на чистом js?
@turalperfectworld1065
@turalperfectworld1065 4 жыл бұрын
Лайк не глядя.
@user-xz6iz4gj5c
@user-xz6iz4gj5c 4 жыл бұрын
Круто!
@alekseyyakovlev3897
@alekseyyakovlev3897 Жыл бұрын
Добрый день! А не подскажите, ка допустим использовать одну тему для светлого оформления сайта, а другую для темного? Я имею ввиду, как сделать переключение темы с помощью ползунка, допустим?)
@ladyafize5689
@ladyafize5689 4 жыл бұрын
Спасибо большое 🔥🔥🔥🔥🔥
@nndryx
@nndryx 3 жыл бұрын
Спасибо долго искал. 1:10 я один делаю сайт на телефоне?
@ShClub317
@ShClub317 3 жыл бұрын
Автор, отзовитесь пожалуйста на мой вопрос! Возможно ли настроить работу фона так, что бы для тех кто заходит на сайт со слабым устройством, то анимация для них не работала? Но для тех у кого мощное железо, то анимация работала? Возможно сделать так, чтоб система видела скорость сигнала входящего трафика и автоматически с заданным порогом скорости сигнала, подстроивалась под него свою работу(показать анимацию фона или нет)?
@lawdriver88
@lawdriver88 Жыл бұрын
Спасибо
@user-wn6gc1iw6m
@user-wn6gc1iw6m Жыл бұрын
Добавил скрипт. Wordpress. А как вывести его на сайт?)
@nik.nametyhev
@nik.nametyhev 2 жыл бұрын
А для каких сайтов подходят эти шаблоны? Подскажите пожалуйста я новичок!
@rishikshrivastav1978
@rishikshrivastav1978 4 жыл бұрын
It helps a lot. But plz add atleast subtitles in your next video.
@madishman4861
@madishman4861 2 жыл бұрын
ERROR: 'VANTA' is not defined - что делать?
@demchyshynsasha6786
@demchyshynsasha6786 2 жыл бұрын
изменить порядок подключения скриптов в html
@worldxxgtd2643
@worldxxgtd2643 Жыл бұрын
@@demchyshynsasha6786 как
@demchyshynsasha6786
@demchyshynsasha6786 Жыл бұрын
@@worldxxgtd2643 вот в таком порядке должны быть подключены скрипты, потому что в первом скрипте эта VANTA объявляется
@user-mb8jm6lu5t
@user-mb8jm6lu5t 2 жыл бұрын
Интересно как этот код вставить в тильду
@user-sh3yk8mo5h
@user-sh3yk8mo5h 4 жыл бұрын
Возникла проблема. Загрузил все как у вас, но выдает ошибку, что не может найти нужный id. В чем проблема
@alex-ns7bg
@alex-ns7bg 2 жыл бұрын
привет, ты решил проблему? можешь подсказать пожалуйста
@Mykhailo_Vdovychenko
@Mykhailo_Vdovychenko 4 жыл бұрын
RTX 2060 на 40% грузится :D
@fantast2568
@fantast2568 4 жыл бұрын
спасибо
@warpoint2
@warpoint2 3 жыл бұрын
Ругается что VANTA не определена... где её нужно определить ?
@demchyshynsasha6786
@demchyshynsasha6786 2 жыл бұрын
изменить порядок подключения скриптов в html
@orangelemon7991
@orangelemon7991 4 жыл бұрын
Где лучше всего учить JS? Какие книги читать?
@cars_owners
@cars_owners 4 жыл бұрын
Вы сперва определитесь для чего вам нужен яп, а потом уже выбирайте. Ведь может будет лучше изуть другой язык, а не js
@orangelemon7991
@orangelemon7991 4 жыл бұрын
@@cars_owners для веба. Посоветуете что то годное?
@orangelemon7991
@orangelemon7991 4 жыл бұрын
@@nisto589 Спасибо.😊
@Diseredato24
@Diseredato24 4 жыл бұрын
Лучше всего читать Play Boy.
@Tetragonchik
@Tetragonchik 4 жыл бұрын
@@Diseredato24 не, Playboy лучше смотреть :)
@MS_industrys
@MS_industrys 2 жыл бұрын
У меня не работает (просто белый фон)
@alex-ns7bg
@alex-ns7bg 2 жыл бұрын
привет, ты решил проблему? можешь подсказать пожалуйста
@Nataliia-bp1py
@Nataliia-bp1py 2 жыл бұрын
@@alex-ns7bg привет! у меня получилось, в скрипты вместо сохраненных файлов js вставила ссылки из директории
@nndryx
@nndryx 3 жыл бұрын
У меня не работает
@kotya7892
@kotya7892 3 жыл бұрын
Разобрался?
@nndryx
@nndryx 3 жыл бұрын
@@kotya7892 нет
@alex-ns7bg
@alex-ns7bg 2 жыл бұрын
привет, ты решил проблему? можешь подсказать пожалуйста
@nndryx
@nndryx 2 жыл бұрын
@@alex-ns7bg не помню, вроде да, а у тебя что?
@mind7982
@mind7982 2 жыл бұрын
@@alex-ns7bg используй сайты для проверки своего кода
Простая анимация SVG | vivus.js
23:55
BrainsCloud
Рет қаралды 32 М.
Gli occhiali da sole non mi hanno coperto! 😎
00:13
Senza Limiti
Рет қаралды 16 МЛН
女孩妒忌小丑女? #小丑#shorts
00:34
好人小丑
Рет қаралды 43 МЛН
I'm Excited To see If Kelly Can Meet This Challenge!
00:16
Mini Katana
Рет қаралды 35 МЛН
Сложная анимация в фигме за 15 минут. Веб-дизайн.
17:44
Как сделать прелоадер? ► CSS/JS
23:33
Хауди Хо™ - Просто о мире IT!
Рет қаралды 125 М.
Последствия блокировки YouTube
25:35
MobileReviewcom
Рет қаралды 31 М.
Gli occhiali da sole non mi hanno coperto! 😎
00:13
Senza Limiti
Рет қаралды 16 МЛН