Слайдер SWIPER. Подробный курс. Подключение настройка примеры.

[@FreelancerLifeStyle]

👋 Узнали что-то новое? Напишите об этом! 🔴 Получить доступ к плюшкам + поддержать канал: www.patreon.com/freelancerlifestyle 🔴 Telegram канал: t.me/freelancer_lifestyle (teleg.run/freelancer_lifestyle) 🔴 Telegram чат по верстке: t.me/flschat (teleg.run/flschat) 🔴 Facebook: facebook.com/freelancerlifestyle 🔴 Instagram: instagram.com/freelancer.lifestyle

[@vladoprya5239]

Давай видос про слайдер и параллакс

[@ЭлшанКулиев-ц6о]

да, хотел бы увидеть урок по навигационному меню с параллаксом

[@ЭлшанКулиев-ц6о]

Жека есть возможность изменить внешний вид каждого булита??

[@Loveispanec]

Відео топ, але я так і не зрозумів реалізацію появи і зникнення слайдеру при динамічній зміні розміру екрана браузера

[@aleksandraafanaseva3390]

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

[@FreelancerLifeStyle]

Спасибо! Я рад что полезно!

[@Timyr48]

"о відос на 50хвилин, круто" подумав я і витратив день шоб розібрати і повторити 3/4 частини цього шедеврального навчального відео! Чудовий матеріал! Дякую за твої старання!

[@aleshagalaxy]

Ставлю лайк авансом ! У фрилансера самый качественный контент !

[@FreelancerLifeStyle]

Спасибо!

[@Qwertyqwerty-tq3we]

+++

[@mefist0feld]

Спасибо за очень хороший подробный обзор. Одно маленькое замечание: 24 августа разработчики выпустили обновление, в котором, кроме всего прочего, класс swiper-container переименовали в swiper. У меня в результате сломался свайпер, так как подключен был через ссылки на сервер разработчика. Разобрался в чём дело, исправил, заработало. Отсюда вывод: ещё один аргумент в пользу того, чтобы скачивать файлы стилей и скриптов, и подключать их локально. Разработчики, как видим, увы не гарантируют обратной совместимости при обновлениях.

[@teizer1122]

спасибо что я прочитал этот комментарий

[@lanash1055]

Добавлю, где это можно посмотреть, может, как раз пригодится тем, кто использует уже 7 версию. После того, как нажали Get Started на сайте разработчиков, обратите внимание на строчку вверху страницы, выделенную красным, там написано "If you are upgrading from Swiper 6 to Swiper 7, check out Migration Guide to Swiper 7". В новой версии свайпера некоторые штуки (к примеру, та же мультистрочность, свободный режим, или, как выше написали про контейнер) уже реализуются по-другому, и там по ссылке сможете посмотреть, что на что поменялось. А Жене огромное спасибо за все, что он делает!!! Учитель с большой буквы!

[@pavel7650]

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

[@МаксимИльич-б3р]

целый час колупал код, гугл . крутил вертел. Надо было сразу почитать коменты )))) Огонь все заработало можно дальше смотреть )

[@bohdansherbak]

@@МаксимИльич-б3р 2 с половиной часа я пытался разобраться что не так, но в комменты пришёл уже как разобрался:)

[@Игорь-ц1т3ж]

Боже, це якесь диво а не слайдер! Я досі в шоці після перегляду, безмірно радий, що натрапив на це відео! Женя, дякую Вам за детальний огляд!

[@shukonfadah5725]

все ваши виде это лучшее что можно найти на русскоязычном сегменте! Я поддерживаю вас во всём! желаю мира и спокойствия вашей стране и семье!!!

[@ilfin3568]

Евгений, спасибо большое за ваш труд, ваши ролики помогают до сих пор людям и еще будут помогать. Мира вам!

[@ivatkachuk1609]

Хвилин 30 витратила на те, щоб зрозуміти, що не так із моїм слайдером, поки не згадала, що колись дивилась відео про swiper і чула інформацію, щодо аномальної поведінки слайдера всередині flex елемента. Всього один css параметр вирішив проблему, дякую!)

[@MobileLegendsImmortal]

Супер!) Перебрал несколько видео, и ни где нет столько тонкостей и деталей... из-за чего не понимал, что к чему) с Вами до 5-й минуте разобрался в том, что делал не правильно

[@rozetka0802]

Сколько смотрю твои видео, харизма так и прёт. Твоя подача просто на другом уровне, в отличие от остальных. Спасибо большое за видео!

[@FreelancerLifeStyle]

Я рад, пожалуйста!

[@deevue_sews]

Один из лучших твоих видосов между прочим, получился) Очень круто рассказал и поработал. Этого урока очень нам не хватало. Ты сейчас реально сделал нашу жизнь лучше. Стоя аплодирую тебе. А разработчикам слайдера респект за слайдер и подзатыльник что сами не сделали такой видос, а просто вывалили всю инфу, мол сами разбирайтесь. Начинающий верстальшик хрен когда разберется с этим, а ты нам помог.

[@FreelancerLifeStyle]

Я рад что полезно!

[@ПапасАлиной]

Только сегодня открыл для себя этот слайдер, а тут прямо в руки падает твой обзор. Это божественно!

[@FreelancerLifeStyle]

Я рад!

[@АлексейДолгов-ц3ф]

Замечательно! Скролл страницы слайдером и с меню нужен обязательно!!!!

[@FreelancerLifeStyle]

Понял, сделаю

[@lova4475]

Це мега крутий випуск! Велика дяка) Розжував так, що і питань нема) Свайпер та попап цікаво було б побачити!)

[@aurocheg]

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

[@Максим-д1у4щ]

Да, видос со слайдером страницей, параллаксом и прочим нужен!

[@mangixlaxdg8690]

Жека, ты очень крутой парень. Такое чувство что я знаю тебя с детства и ты мой давний товарищ. Особенно твоя манера беседы. Спасибо за уроки - с тобой развитие становится комфортным!

[@FreelancerLifeStyle]

Я рад!

[@jiza2377]

Спасибо за курс по swiper. Все перепробовал ничего не работало, как только подписался на канал, о магия все заработало;)

[@FreelancerLifeStyle]

Ахах) Это правда!

[@crabsburger501]

Господи жека, столько времени искал что бы исправить штуку при переключении на табах, а тут оказывается просто обновления слайдера надо было) плоохо искал значит) Просто лучший!

[@Ggg-lv3jh]

Дякую!!! Дуже детальна подача інформації! Головне, уважно слідкувати і повторювати.

[@Frie666]

Ура! Спасибо! Очень полезный контент, качество моей верстки улучшается с каждым твоим видео )

[@FreelancerLifeStyle]

Я рад!

[@jasonborn4373]

Благодарность этому человеку низкий поклон!!!!Евгений жму руку спасибо!!!PERFECT!

[@HappY-ij8wj]

Під все що треба для навчання в вас є відео, ну тупо ідеальний канал, дякую за вашу працю

[@ЕленаНекит]

Спасибо большое, Евгений. Доступно объяснять сложные вещи - это талант и у вас он, определенно, есть. Ваш канал просто находка для начинающих. Успехов вам!

[@ttcan6320]

Вот бы ещё показывал весь код примеров, как правило около четверти функций на подобных видео не работает.

[@SuperRAilya]

11:19 скрол 12:33 simulateTouch отключить на пк 15:44 mouseWheel переключение колесом мыши 19:10 watchOverflow: true, (комментарий для себя )

[@Yurii_Mitrofanov]

да, хотел бы увидеть урок по навигационному меню с параллаксом

[@paradox-player]

Нашёл этот слайдер буквально 2 дня назад, очень понравился своей простотой и функциональностью, как раз делаю сайт друзьям сверстал все кроме слайдера ) а тут твое видео выходит это прям знак свыше спасибо за видео ну и лайк конечно

[@FreelancerLifeStyle]

Спасибо, я рад!

[@alexbulohov4462]

Братишка, какой же ты крутой! Мучался 6 часов, не мог понять почему не правильно идет подсчет слайдеров в пагинации.... Посмотрел твой ролик и все ясно как белый день. Спасибо за твой труд!

[@ups7write]

Блокбастер по Swiper. Однозначно! С тайм кодами вообще СУПЕР!

[@FreelancerLifeStyle]

Я рад!

[@ВасилийКарнеев-р7э]

Я ставил слайдер, но ты показал очень много новых фишек, в частности настройки под себя.) Спасибо 👍

[@FreelancerLifeStyle]

Я рад что полезно!

[@Владислав-м1к7у]

Мучался,мучался с этими скроллами на простом Js/jquery. Не первый раз вас смотрю и не первый раз удивляюсь! Классная подача урока. Желаю огромного продвижения,спасибо!))

[@ВиталийБабаджанян-в9м]

Евгений, приветствую! Спасибо большое тебе за твой труд, ты большой молодец. Очень большое видео получилось, но я посмотрел его от начало и до конца, т.к было очень интересно. Спасибо еще раз

[@ЕвгенийКолобов-х4з]

Очень интересно было бы посмотреть как сделать слайдер на всю страницу с параллакс эффектом))) А за видео спасибо, очень информативно и развёрнуто! Лайк!

[@FreelancerLifeStyle]

Ок, сделаю!

[@tolmach_y]

@@FreelancerLifeStyle очень прям ждем!

[@VovadjoSenseii]

Дякую за цей відос, дуже корисний туторіал, користуюсь Slider-Swiper на базі стартового шаблону все працює корректно, та й налаштувань там більш ніж достатньо.

[@ZPUA24]

Как раз довёрстываю сайт девушке к ДР, и пришло время именно слайдера, ну и как всегда твои уроки и инфа вовремя)

[@МаратБагаутдинов-т1ю]

Вчера я потратил 10 часов на изучение видоса о slick-slider. Утром иду на кухню, делаю себе кофе, включаю ютубчик, а там! А там еще 15 часов годнейшего материала для изучения. Пол второго ночи, с чувством легкой эйфории от того, что почти всё завелось как на видео, и резью в глазах - собираюсь спать) Ведь на завтра в планах иконочные, мать их, шрифты)) Спасибо, Евгений, отличные видео, очень доступно, понятно, полно и информативно! Канал заслуживает свой млн подписчиков, это только вопрос времени, держись, бро!

[@le0messi]

как успехи в IT?

[@МаратБагаутдинов-т1ю]

@@le0messi всё отлично, устроился курьером))))

[@le0messi]

@@МаратБагаутдинов-т1ю жаль конечно, если не секрет, что не так пошло? Просто учишься ещё или забросил? Надоело, слишком сложно или другая причина?

[@МаратБагаутдинов-т1ю]

@@le0messi Прошел курс Яндекса на фронт разработчика, но как диплом получил в октябре того года - за два месяца (ноябрь, декабрь) не смог попасть ни на одно собеседование на Джуна. Сильно на этой почве психанул и занялся другими делами, весной не особо уделял время на поиск работы. А вот потом случился небольшой кризис )) и вакансий на джунов сильно меньше стало. В итоге, я уже сильно по деньгам просел и понял, что больше не могу тратить время на домашнее обучение, какие-то тестовые проекты и прочее. И остался я со знанием scss, js и react - не востребован, потому что опыта реальных проектов нет)) пришлось бежать зарабатывать деньги курьером) Но! почти все из моей группы кто обучался в Яндексе и дошёл до диплома - нашли работу в итоге. Так что моя история не показатель.

[@kotlancer]

Женя, это пушка! посмотрел пока половину и мне уже очень нравятся возможности этого слайдера !

[@FreelancerLifeStyle]

Отлично!

[@СергейГартер]

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

[@FreelancerLifeStyle]

Спасибо)

[@НиколайПрытков-е1ц]

у меня просто нет слов, мне очень помогает ваш контент!!! огромное спасибо за такую проделанную работу!!!

[@andrewstarcev]

Ждем видео про свойство Calc() и другие функции css))

[@FreelancerLifeStyle]

Понял)

[@dmitrykon8606]

А зачем видео про calc ? Это же элементарная функция, не?

[@danielfadeev]

@@dmitrykon8606 кому как

[@pitbrest]

Наконец я дошел до слайдеров и как всегда на помощь пришел высококачественный видос от Жеки, очередной раз большое спасибо!

[@Fenjkeee]

Ну это реально человек, который шарит)

[@front-end14]

півтора роки пройшло, а цей гайд найкращий і постійно виручає, дякую)

[@ОлегЕ-и7х]

Спасибо за урок! По поводу "35:52 - Zoom картинок". Отвечаю на вопрос: "Да, хотелось бы видос по тому как подключить отдельный плагин для попапа zoom-ных изображений"

[@FreelancerLifeStyle]

Понял, сделаю)

[@white_kitty]

а можно ссылочку на это видео если оно есть?)@@FreelancerLifeStyle

[@annamets]

Очень круто, как всегда! Подробно, понятно, воодушевляюще! Про плагины галерей с удовольствием послушаю! И ещё хотелось бы про кастомный скролл, как туда всякие циферки выезжающие вставлять, картинки и прочее.

[@yaavtor]

Какой же ты молодец! Все понятно и очень интересно рассказано. Всех благ тебе, благодарю за труд.

[@yuriilukianovych8660]

Дякую за відео!!! Як завжди на висоті! Реално дуже гибка штука, ще й на чистому JS 💪

[@DimaGaranin]

05:16 min-width: 0 -> ОФИГЕТЬ! Гениально!

[@FreelancerLifeStyle]

Хех)

[@ДмитрийКошелев-и3д]

я блин целых 2 ЧАСА думал, почему у меня slick слайдер не адаптивится на странице. Я ещё никогда так зол не был) Уже хотел swipe изучить, и тут ты)

[@khalilmutallibov]

Огромное спасибо! Я не перестаю удивляться тому, как ты запариваешься над созданием контента! Слайдер действительно очень функциональный и удобный, лучше, чем slick. Еще раз спасибо, жду уроки по другим темам. Удачи!

[@FreelancerLifeStyle]

Пожалуйста!

[@АлексейЮжаков-л8ш]

Большое спасибо за урок, некоторые фишки не мог понять как работают, теперь всё стало на свои места!

[@айзеказимов-ч2т]

Ураааааааааааааааа!!! супер! наконец-то гайд по супер слайдеру, лайк не глядя ))) P.S. 4:46 - олени огонь :))

[@FreelancerLifeStyle]

СПасибо!

[@zakharkibanov8929]

О, где ты был 2 месяца назад))) шикарный слайдер

[@FreelancerLifeStyle]

Уверен, в видео все равно много нового :)

[@Сергей-ю8и1х]

Кладезь знаний и новшеств каждое видео канала! Мега круто! И +1 голос за видео про calc() по возмонжности)) Большое спасибо! С первой до последней минуты лучший учебный материал!

[@yaroslavbox1249]

Искал этот вопрос 20:50​ - Кол-во слайдов для прокрутки, и нашел !!! + таймкоды !!! cool !!!

[@dema5783]

дуже цікаве та корисне відео!!! Дякую Вам

[@i2ak8a]

Даааа, видео полноэкранную прокрутку лично мне очень нужно! Особенно момент, когда у нас идет вертикальная прокрутка мышью, на определенном слайде меняется направление на горизонтальное, а потом снова продолжается вертикально

[@yurkaronin]

Отличное обучающее видео. как раз пользуюсь этим слайдером. Спасибо вам, Евгений Андриканич :) Вы очень помогаете своими роликами.

[@FreelancerLifeStyle]

Пожалуйста! Я рад!

[@xxxprog4818]

Как же вовремя, мне как раз кинули линк на сайт Свайпер и я не понимал что к чему. И тут обзор Спасибо!

[@alucardfarg]

Жек каждый раз возвращаюсь к твоим крутым видосам и нахожу решения своих задач спасибо тебе огромное за труд!!

[@ВикторияИльина-н7о]

Самое полезное и интересное видео, которое я видела за последнее время! Спасибо огромное!)

[@FreelancerLifeStyle]

Пожалуйста!

[@ЮрийПолищук-д6ф]

Круто, лайк не глядя.

[@FreelancerLifeStyle]

Спасибо!

[@ffedchik]

ЭТА Пушка, бомба, РАКЕТА! Смотреть новый выпуск, Лечу словно комета. Без каких-либо затруднений, Запускаю видосик, А там (04:44) кино про оленей. И теперь-то я точно уже не аутсайдер, Благодаря полному гайду Жеки, Запустил я свой первый swiper-слайдер!

[@FreelancerLifeStyle]

Ух, репчик подъехал :)

[@ffedchik]

@@FreelancerLifeStyle чики-чики бум. :)

[@biLLie_wiLLie]

хороший урок. Спасибо! Про переменные css и гриды интересно от тебя послушать

[@FreelancerLifeStyle]

Гриды тут kzbin.info/aero/PLM6XATa8CAG5pXQrW_kDaeZb_uIAMNZIm

[@ЯнаАлександровна-э7к]

Божественно! Мир стал чуточку лучше)

[@olegsemenukha4107]

Чем дальше, тем круче! Спасибо!!! ;-) Уроки по calc - это бы было здорово! Очень интересная штука!

[@FreelancerLifeStyle]

Пожалуйста!

[@ЕвгенийАлмазов-м6и]

Чувак, ты лучший! Подпишусь на твою инста карточку пожалуй, и телеграмм заодно. Даешь заряд мотивации всегда и при любом раскладе, с тобой я дойду до финишной прямой и я в это верю! Колокольчик прожат, ни разу не пожалел что подписался на тебя, лайки ставятся заранее и по отработанной схеме. Не забрасывай свой канал, без тебя таким новичкам как я будет сложнее. Удачи в личной жизни и профессионального роста! Я тебе безмерно благодарен!

[@FreelancerLifeStyle]

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

[@ДарьяАрсеньева-х9и]

Да, нам очень-очень нужны все твои видео! В частности про поэкранную прокрутку и calc!;)))))

[@FreelancerLifeStyle]

Я рад!)

[@ДмитрийБогданов-э5ы]

Все четко, понятно, интересно и полезно! Благодарю! Плагины галереи и поэкранная прокрутка очень интересны)

[@FreelancerLifeStyle]

Я рад!

[@serhiimaliuha69]

Всегда ставлю лайк, когда в видео встречаю полезную для меня информацию. В этот раз, первое было - это фикс с помощию min-width: 0; Раньше изголялся с помощью overflow: hidden; (флекс контейнету, ну лили элементу). Твой вариант будет правельнее. Спасибо!

[@FreelancerLifeStyle]

Я рад!

[@КириллКарманов-ш4н]

Большое спасибо, сегодня как раз появилась необходимость сделать слайдер.

[@FreelancerLifeStyle]

Я рад!

[@VitaliiMaevskii]

Классный урок! Слайдер прямо действительно очень мощный! Спасибо, Женя)

[@FreelancerLifeStyle]

Пожалуйста!

[@АсяА-ч3я]

Спасибо огромное за видео, оно спасло мои нервы и подняло настроение, благодаря вам у меня заработало всё! Еще раз спасибо.

[@Rampaso]

Очень круто))) Спасибо что все подробно рассказал)) твое видео очень помогло разобраться с этой библиотекой)) Ты крутой!!)

[@stylelifedeal.wyndace]

Круто! Вчера только о нём узнал, а тут видео с его полнейшим разбором!

[@FreelancerLifeStyle]

Я рад!

[@АлександрБайшев-р4г]

Урок по навигационному меню с параллаксом и видео про свойство Calc() однозначно ждём!!!!) И спасибо за проделанную работу!!!! Очень крутой выпуск!!!!

[@todayisyourfuture]

Спасибо Женя. Ты очень хороший человек и ты мой друг 🙂

[@FreelancerLifeStyle]

Спасибо!

[@МаксимАртемьев-з2д]

Молодца, с удовольствие посмотрел, хороший контент, доступная подача!!!

[@FreelancerLifeStyle]

Спасибо, я рад!

[@bloodfalka589]

Дякую, виклав відео через 5 хвилин після того, як я сів робити слайдер)

[@evgeniybelousov6738]

Спасибо! Очень информативно и доступно. Жаль что этот крутой инструмент не попался раньше на глаза.

[@gritsienkooleg3447]

Не, ну это однозначно годнота! Как и всё на канале! Вот, что значит, когда делают от души!

[@MegaTesei]

Классный видос по слайдеру. Очень нравиться этот слайдер, чувствую, что он проще в инициализации, чем СликСлайдер. Топ примеры. С паралаксом ваще огонь! Можно задуматься над применением слайдера без подключения GreenSocks

[@rustyspc9046]

Вышел видосик у Жеки- палец сам тянется на лайк. Спасибо за контент)

[@FreelancerLifeStyle]

Пожалуйста!

[@jasonborn4373]

Ребята Евгений это мега человек! Женя спасибо!

[@Xyjail]

Где я был 2 года назад, когда вышел этот видос??? Уже б мидлом был бы, если бы тогда учился по этим видосам))))) Дякую, вялiкi дзякуй за навчання))))

[@cardinalswift4828]

Вот он, отборный высококачественный контент)) Не видел на канале видео про React и npm-пакеты, но вдруг если занимаешься - с удовольствием посмотрю и нахватаюсь заметок)

[@gin101]

Блин Жека, спасибо что ты есть!) дали задание, запустить автопрокрутку слайдера, а стоит как раз свайпер, а я хер знает че там тыкать) ахха) но ты как всегда приходишь на помощь!)

[@placid3495]

Жека, ты крутой! )) Так офигенно разжевал про слайдер! Огромное тебе спасибо!

[@MrOne865]

От души за min-width: 0;

[@FreelancerLifeStyle]

Ахах) Пожалуйста!

[@franclin777]

Благо Дарю за курс! Очень жду видео про зум попап галереи)

[@FreelancerLifeStyle]

Сделаю!

[@haskvel]

Як завжди, спочатку лайк потім перегляд. Той момент коли вже знаєш, що буде крутий відос. Зроби відос про галерею.

[@niceman5890]

Крутая вещь! Спасибо за подробное объяснение!

[@WillATL]

"Как вам олени?" - это конечно ОГОНЬ ))))) Я просто не сразу заметил, что в вопросе нет запятой перед словом олени ))))

[@ВикторЛынша]

Ваш позитив заразителен)👍

[@FreelancerLifeStyle]

Я рад!

[@алексполян-я7к]

Жека, большое спасибо. Как всегда ты даешь своевременный, необходимый, практичный контент. С удовольствием лайк видосу.

[@FreelancerLifeStyle]

Я рад!

[@МаксимАртемьев-з2д]

Супер, класс, здорово восхищаюсь вашей версткой!!!!!!!

[@sergeychernenko9883]

Спасибо огромное! В интернете не так уж и просто найти swiper на чистом JS. Респект!

[@ТатьянаКоваленко-ь8я]

ОГРОМНОЕ СПАСИБИЩЕ за такой подробный урок

[@Вячеслав-у9т]

Не ожидал, что будет разбор этого слайдера, но спасибо. Хоть уже и пользуюсь им некоторое время - все равно узнал что-то новое.

[@mvssss_]

Очень помог с обновлением слайдера! Не мог сделать слайдер в табах, спасибо большое!