JS-плагины №6. Галерея фотографий и видео с помощью Fslightbox.js

Поделиться
HTML-код
  • Опубликовано: 19 янв 2025

Комментарии • 51

  • @nairi_ogan
    @nairi_ogan Год назад

    Наконец нашел четкую библиотеку, спасибо за обзор)

  • @svet0v
    @svet0v 4 года назад

    Спасибо, как раз собирался искать замену fancy box на чистом джс)

    • @maxgraph
      @maxgraph  4 года назад

      Рад помочь)

  • @alexandrgusletsov2567
    @alexandrgusletsov2567 4 года назад

    простое и подробное объяснение , спасибо

  • @STELLS541
    @STELLS541 3 года назад

    Очень живое видео и информативное)
    Пасиб!!

    • @maxgraph
      @maxgraph  3 года назад

      Пожалуйста)

    • @STELLS541
      @STELLS541 3 года назад

      @@maxgraph , а вот возник такой кейс сейчас
      делаю галерею и в ней есть одно видео, помимо картинок, а как вот можно отслеживать то, что у нас сейчас открыто?
      то есть если мы кликаем на первый элемент и листаем дальше, то как ловить тот элемент, который открыт сейчас?
      то есть мы кликаем не на нужный нам элемент, а кликаем на первый и дальше листаем галерею, и как ловить элемент, который открыт в данный момент?

  • @АннаБекренева-я3ы
    @АннаБекренева-я3ы 2 года назад

    Спасибо за видео! Буду использовать плагин в новом проект) а подскажите, пожалуйста, есть ли плагин на чистом js по типу mixitup, который на джеквери?

  • @videokotsar
    @videokotsar 3 года назад

    Хорошая галерея. Спасибо шеф!

    • @maxgraph
      @maxgraph  3 года назад

      Пожалуйста)

  • @Pne-b8z
    @Pne-b8z 2 года назад

    Хорошое, понятное , а главное полезное видео 👍

    • @maxgraph
      @maxgraph  2 года назад

      Рад помочь)

  • @nargizaliyeva9743
    @nargizaliyeva9743 4 года назад +1

    Спасибо! очень интересно!

  • @oleg_andrianov
    @oleg_andrianov 4 года назад

    Спасибо, очень хороший разбор!

    • @maxgraph
      @maxgraph  4 года назад

      Пожалуйста)

  • @АбакумовАлексей-п5м

    как правильно подключить через npm, к сожалению ты почти не рассказываешь о таком подключении((

    • @maxgraph
      @maxgraph  Год назад

      Не рассказываю, потому что задача видео - показать функционал плагина. А уж в импортах и npm нужно давно разбираться, почитайте learn.javascript.ru

    • @semyonsubochev4284
      @semyonsubochev4284 Год назад

      @@maxgraph через команду npm устанавливаем в наш проект, а далее куда копать не подскажете ?
      Напрямую как в видосе подключал, атрибуты тоже указал, на край и структуру повторил, но почему-то стрелки не появляются всё равно.(Использую Вашу gulp сборку)

    • @semyonsubochev4284
      @semyonsubochev4284 Год назад

      1) делаем npm установку ( как в инструкции к плагину)
      2) прописываем в шапке main.js такой импорт (import '../../node_modules/fslightbox';) тем самым мы его импортируем в наш файл. рекомендую прописать в самой верхней строке.
      и тогда все работает.

  • @pavliken1337
    @pavliken1337 2 года назад

    Здравствуйте.
    Подскажите, галлерея работает, но при клике на изображение перебрасывает в начало страницы. Как это можно пофиксить?
    UPD.
    Примерно разобрался, это происходит, потому что у меня на body стоит overflow-x: hidden.
    Вопрос: как фиксануть этот баг, если мне все-таки нужен overflow-x: hidden для body ?

    • @maxgraph
      @maxgraph  2 года назад

      Вряд ли он нужен) для чего?

  • @ihorv44
    @ihorv44 3 года назад

    супер. спасибо за видео

    • @maxgraph
      @maxgraph  3 года назад

      Пожалуйста)

  • @КонстантинСигуев
    @КонстантинСигуев 3 года назад

    Спасибо! Как сделать poster на видео? Poster не показывается в галерее / video html 5.

  • @valerypobelenskiy1001
    @valerypobelenskiy1001 4 года назад

    Маким, вечер добрый) почему при установки этого плагина мне пишится invalid source?? (когда я кликаю по картинкам) хотя я скопировал все файлы с вашего гитхаба

    • @maxgraph
      @maxgraph  4 года назад

      Смотреть надо)

    • @valerypobelenskiy1001
      @valerypobelenskiy1001 4 года назад +1

      Все спс) Заработало надо было не через диск С, а Open server local host

    • @rosumere
      @rosumere 4 года назад +2

      @@valerypobelenskiy1001 пздц, вот если честно - совсем не очевидное решение проблемы.

    • @valerypobelenskiy1001
      @valerypobelenskiy1001 4 года назад

      а вы не восторгайтесь ) предлогайте, если есть что добавить по этому вопросу) буду рад и благодарен

  • @fox_0811
    @fox_0811 2 года назад

    Заказчику до фанаря на чем делается. Главное чтоб работало)
    Кстати фенси на чистом js есть.

    • @maxgraph
      @maxgraph  2 года назад

      Не всем заказчикам до фонаря))

  • @andrewandrosow4797
    @andrewandrosow4797 3 года назад

    При малых разрешениях < 665px нету кнопок для пролистывания..

    • @maxgraph
      @maxgraph  3 года назад

      У плагина?

    • @andrewandrosow4797
      @andrewandrosow4797 3 года назад

      @@maxgraph Да. Запусках в файрфокс - но потом какого то хрена они таки появились... Причем я ничего не исправлял... Просто с браузером баг наверное... У оперы не наблюдалось...

  • @АртемТитов-з4о
    @АртемТитов-з4о 2 года назад

    как быть с адаптацией, сжимается контент за модальным окном

    • @maxgraph
      @maxgraph  2 года назад

      Ну сайт и должен сжиматься) не понял проблему

  • @AOFTG
    @AOFTG 3 года назад

    Купил про версию, могу сказать, что fancybox3 куда более гибче, чем Fslightbox.js. Fslightbox.js отлично подходит под , img, video. В общем для любой галереи. А вот модальные окна (на любой цвет и вкус) из него создавать не очень получается.
    Буду использовать Fslightbox.js для галерей изображений, или для встраивания карт или видео, в этом плане он мне нравится.

  • @videokotsar
    @videokotsar 3 года назад

    Скрытые элементы он прекрасно видит, надо только divы расставить правильно

  • @НурдаулетКубайдолла

    invalid source пмоги бро что делать?

    • @maxgraph
      @maxgraph  3 года назад

      Посмотреть надо

    • @romanprihodko7360
      @romanprihodko7360 3 года назад +1

      Нужно использовать Open server, а точнее localhost