- Swiper doesnt update #299
- Comments
- ouraios commented Mar 23, 2018
- dimonx3 commented Mar 27, 2018
- surmon-china commented Apr 18, 2018 •
- MichalKrakow commented May 7, 2018
- ouraios commented May 11, 2018
- donng commented May 25, 2018
- jgribonvald commented Sep 5, 2018
- mrGrochowski commented May 29, 2019
- Mark910413 commented Jul 16, 2019 •
- jgribonvald commented Jul 16, 2019
- Mark910413 commented Jul 18, 2019 •
- kurumbus commented Aug 21, 2019 •
- Rhogar commented Sep 4, 2019 •
- timmi-on-rails commented May 7, 2020
- katerlouis commented Feb 17, 2021 •
- проблема с опасным swiper с динамическим контентом
- 7 ответов
- Почему в Swiper JS пагинация с фракцией не работает?
- Некорректная работа при многоразовой инициализации swiper slider`ов на сайте
- 1 ответ 1
- Swiper Changelog
- 7.0.9 (2021-10-18)
- Bug Fixes
- 7.0.8 (2021-10-04)
- Features
- 7.0.7 (2021-09-29)
- Bug Fixes
- 7.0.6 (2021-09-16)
- Bug Fixes
- Features
- 7.0.5 (2021-09-09)
- Bug Fixes
- 7.0.4 (2021-09-08)
- Bug Fixes
- Features
- 7.0.3 (2021-09-03)
- Bug Fixes
- 7.0.2 (2021-08-31)
- Bug Fixes
- 7.0.1 (2021-08-26)
- Bug Fixes
- 7.0.0 (2021-08-25)
- Bug Fixes
- Features
- 6.8.4 (2021-08-23)
- Bug Fixes
- 6.8.3 (2021-08-20)
- Bug Fixes
- 6.8.2 (2021-08-16)
- Bug Fixes
- 6.8.1 (2021-08-03)
- Bug Fixes
- Features
- 6.8.0 (2021-07-22)
- Bug Fixes
- 6.7.5 (2021-07-01)
- Bug Fixes
- Features
- 6.7.1 (2021-06-23)
- Bug Fixes
- Features
- 6.7.0 (2021-05-31)
- Bug Fixes
- Features
- 6.6.2 (2021-05-19)
- Bug Fixes
- 6.6.1 (2021-05-11)
- Bug Fixes
- 6.6.0 (2021-05-11)
- Bug Fixes
- Features
- 6.5.9 (2021-04-30)
- Bug Fixes
- Features
- 6.5.8 (2021-04-23)
- Bug Fixes
- Features
- 6.5.7 (2021-04-16)
- Bug Fixes
- Features
- 6.5.6 (2021-04-09)
- Bug Fixes
- 6.5.5 (2021-04-08)
- Bug Fixes
- 6.5.4 (2021-04-05)
- Bug Fixes
- 6.5.3 (2021-03-31)
- Bug Fixes
- 6.5.2 (2021-03-30)
- Bug Fixes
- 6.5.1 (2021-03-29)
- Bug Fixes
- Features
- 6.5.0 (2021-03-05)
- Bug Fixes
- Features
- 6.4.15 (2021-02-18)
- Bug Fixes
- 6.4.14 (2021-02-17)
- Bug Fixes
- Features
- 6.4.12 (2021-02-16)
- Bug Fixes
- Performance Improvements
- 6.4.11 (2021-02-06)
- Bug Fixes
- Features
- 6.4.10 (2021-01-29)
- Bug Fixes
- 6.4.9 — Released on January 28th, 2021
- Bug Fixes
- Features
- 6.4.8 — Released on January 22th, 2021
- 6.4.7 — Released on January 21th, 2021
- 6.4.6 — Released on January 20th, 2021
- 6.4.5 — Released on December 18th, 2020
- 6.4.4 — Released on December 18th, 2020
- 6.4.1 — Released on December 9th, 2020
- 6.4.0 — Released on December 8th, 2020
- 6.3.5 — Released on October 30th, 2020
- 6.3.4 — Released on October 20th, 2020
- 6.3.3 — Released on October 9th, 2020
- 6.3.2 — Released on September 28th, 2020
- 6.3.1 — Released on September 25th, 2020
- 6.3.0 — Released on September 25th, 2020
- 6.2.0 — Released on September 4rd, 2020
- 6.1.3 — Released on September 3rd, 2020
- 6.1.2 — Released on August 17th, 2020
- 6.1.1 — Released on July 31th, 2020
- 6.1.0 — Released on July 31th, 2020
- 6.0.4 — Released on July 15th, 2020
- 6.0.3 — Released on July 14th, 2020
- 6.0.2 — Released on July 9th, 2020
- 6.0.1 — Released on July 7th, 2020
- 6.0.0 — Released on July 3rd, 2020
- 5.4.5 — Released on June 16th, 2020
- 5.4.3 — Released on June 13th, 2020
- 5.4.2 — Released on June 3rd, 2020
- 5.4.1 — Released on May 20th, 2020
- 5.4.0 — Released on May 15th, 2020
- 5.3.8 — Released on April 24th, 2020
- 5.3.7 — Released on April 10th, 2020
- 5.3.6 — Released on February 29th, 2020
- 5.3.1 — Released on February 8th, 2020
- 5.3.0 — Released on January 11th, 2020
- 5.2.1 — Released on November 16th, 2019
- 5.2.0 — Released on October 26th, 2019
- 5.1.0 — Released on October 16th, 2019
- 5.0.4 — Released on September 30th, 2019
- 5.0.3 — Released on September 19th, 2019
- 5.0.1 — Released on September 17th, 2019
- 5.0.0 — Released on September 17th, 2019
- 4.5.1 — Released on September 13th, 2019
- 4.5.0 — Released on February 22nd, 2019
- 4.4.6 — Released on December 19th, 2018
- 4.4.5 — Released on December 14th, 2018
- 4.4.2 — Released on November 1st, 2018
- 4.4.1 — Released on September 14th, 2018
- 4.4.0 — Released on September 14th, 2018
- 4.3.5 — Released on July 31th, 2018
- 4.3.3 — Released on June 5th, 2018
- 4.3.2 — Released on June 1st, 2018
- 4.3.0 — Released on May 27th, 2018
- 4.2.6 — Released on May 1st, 2018
- 4.2.5 — Released on April 29th, 2018
- 4.2.2 — Released on April 1st, 2018
- 4.2.0 — Released on March 16th, 2018
- 4.1.6 — Released on February 11th, 2018
- 4.1.5 — Released on February 10th, 2018
- 4.1.0 — Released on January 13th, 2018
- 4.0.7 — Released on November 28th, 2017
- 4.0.6 — Released on November 13th, 2017
- 4.0.5 — Released on November 7th, 2017
- 4.0.3 — Released on October 27th, 2017
- 4.0.2 — Released on October 18th, 2017
- 4.0.1 — Released on October 11th, 2017
- 4.0.0 — Released on October 4th, 2017 🎉
- 4.0.0-beta.4 — Released on September 20th, 2017
- 4.0.0-beta.3 — Released on September 13th, 2017
- 4.0.0-beta.2 — Released on September 2nd, 2017
- 4.0.0-beta.1 — Released on August 30th, 2017
- 3.4.2 — Released on March 10th, 2017
- 3.4.1 — Released on December 13th, 2016
- 3.4.0 — Released on October 16th, 2016
- 3.3.1 — Released on February 7th, 2016
- 3.3.0 — Released on January 10th, 2016
- 3.2.7 — Released on December 7th, 2015
- 3.2.6 — Released on November 28th, 2015
- 3.2.5 — Released on November 21st, 2015
- 3.2.0 — Released on November 7th, 2015
Swiper doesnt update #299
Comments
ouraios commented Mar 23, 2018
When i increase the number of slidesPerView the Swiper component doesnt update the number of slides displayed per view even if i call the update method on the component.
How can i do to force the swiper component to render with the updated options ?
The text was updated successfully, but these errors were encountered:
dimonx3 commented Mar 27, 2018
I also can not understand how to change params after init.
You can try change some params directly in swiper instance. But not all params works.
this.swiper.params.slidesPerView = 3;
See Async data example.
I’m not sure if this is the right way.
You can also try call destroy() and init().
surmon-china commented Apr 18, 2018 •
MichalKrakow commented May 7, 2018
doesnt work with lazy loading.
ouraios commented May 11, 2018
As i said @surmon-china it doesnt work even after calling the update method :/
donng commented May 25, 2018
Do anybody know how to update swiper after I change swiper options?
jgribonvald commented Sep 5, 2018
I have nearly a same problem.
When using vue-cli to serve the app I don’t get any problem, but when deploying to a builded component the update doesn’t work anymore and also any actions (next, prev, etc. ) are working I need to make actions manually.
I’m using it in web-components !
mrGrochowski commented May 29, 2019
doesnt work with lazy loading.
have the same issue
Mark910413 commented Jul 16, 2019 •
I got the same issue. Have you solved it? @jgribonvald
jgribonvald commented Jul 16, 2019
I got the same issue. Have you solved it? @jgribonvald
I manage all actions manually but I call component functions.
Mark910413 commented Jul 18, 2019 •
I got the same issue. Have you solved it? @jgribonvald
I manage all actions manually but I call component functions.
That is to say, you haven’t solved it yet?
kurumbus commented Aug 21, 2019 •
Hey guys, same question here.
There’s of course a hack with hanging v-if=»showSlider » on the slider and then watching for changing in swiper options.
But it’s a bad way.
Rhogar commented Sep 4, 2019 •
this.$refs[your swiper component ref ].swiper.destroy()
this.$nextTick(() => <
this.$refs[your swiper component ref].mountInstance()
this.$refs[your swiper component ref].swiper.update()
>)
timmi-on-rails commented May 7, 2020
Changing the parameters/options of a swiper after initialization does not seem to be a supported scenario.
Looking at https://swiperjs.com/api/, there are only very few functions like mySwiper.changeDirection(direction) that allow updating certain options after initialization.
Therefore I would not recommend manipulating the mySwiper.params directly.
I found a solution to the problem here: https://michaelnthiessen.com/force-re-render/.
My problem is similar. I have to recreate the swiper when changing the loop option.
This can be achieved like so:
This works, because vue will automatically recreate the component, if the key changes.
I guess if you want to change multiple options you would have to come up with a different key.
There are two things the library authors should consider imo:
- https://swiperjs.com/api/ should make the mySwiper.params object a copy of the initial options (at the point of initialization), if it is not meant to be changed after initialization. This would avoid people implementing hacks that work with some of those options for now, but may not in the future.
- vue-awesome-swiper could try to find a way to show that options cannot change after creation of the component, so people won’t try binding them and expect it to work. Don’t know if that is possible somehow in vue?
katerlouis commented Feb 17, 2021 •
slidesPerView is a setting the swiper docs claim to be changeable by using breakpoints: <>
And manuall doing mySwiper.params.slidesPerView = 3 followed by mySwiper.update() makes the slides widths recalculate.
In the following example, calling the Vue method updateManually() makes swiper react and display 3 slides per view, as expected.
Источник
проблема с опасным swiper с динамическим контентом
Я применяю плагин idangerous swiper для прокрутки контейнера, содержимое которого динамически загружается с помощью ajax, я инициализирую плагин после вызова ajax, проблема в том, что прокрутка не работает, пока я не изменю размер браузера. Я протестировал его со статическим контентом, он работает нормально, нет необходимости изменять размер окна, но как только я переключаюсь на динамический контент, прокрутка не работает, пока я не изменяю размер браузера.
Вот как я инициализирую плагин
Высота контейнера-шпинделя составляет 100%
7 ответов
Я нашел решение, я добавил эту функцию, которую я вызываю после первой инициализации плагина
Это исправление было упомянуто в другом плагине, и когда я попробовал его с этим плагином, это сработало. Это связано с тем, что плагин не знает об изменениях, произошедших в DOM.
У меня есть решение без JS.
HTML
CSS
Следовательно, этот метод также будет работать для создания любого размера div так, как это делает изображение. Масштабирование его высоты с фиксированным соотношением сторон по ширине.
Волшебство заключается в том, что браузеры обрабатывают значения margin / padding% как процент от ширины элемента, даже если вы дополняете верх или низ указанного элемента.
Надеюсь это поможет!
Я просто хотел добавить, что у меня также были проблемы с настройкой Swiper для работы с динамически загружаемым контентом через ajax . Это совершенно очевидно, потому что контент еще не был загружен, когда был запущен Swiper. Я решил это, используя собственную функцию добавления Swiper вместо моей собственной. Это было в версии 3.3.1, и это исправило это для меня без необходимости использовать setTimeout() или что-то еще!
Я надеюсь, что это помогает некоторым нуждающимся людям!
Для адаптивного дизайна я вызываю следующий метод resizeFix
Обновлено для Изменения в документации Swiper, так как .reInit больше не является функцией.
Мое исправление для Swiper 3.x (я полагаю, что вышеперечисленные обложки 2.x)
Источник
Почему в Swiper JS пагинация с фракцией не работает?
Хочу использовать прогрессбар вместе с пагинацией-фракцией. Для этого создал блок .image-slider__fraction в котором и разместил все элементы. Проблема в том, что он почему-то выдает мне ошибку Uncaught ReferenceError: myImageSLider is not defined. В чем проблема?
Помощь в написании контрольных, курсовых и дипломных работ здесь.
Почему пагинация не работает при переходе по страницам ?
Здравствуйте. Помогите, пожалуйста, разобраться с задачей! Создал CRUD приложение для работы.
Не работает пагинация
Здраствуйте. Есть вот такой код 3, ‘orderby’.
Не работает пагинация
Вывожу отдельную категорию не на индексной странице. Вставляю там пагинацию: 4
Я так понимаю, что вы просто скопировали код, но не сильно в нём разбирались.
У вас не определена переменная myImageSlider, поэтому вам и выдаёт ошибку.
Я поправил ваш код. Но вам нужно внимательнее быть со свойством slides, он подхватывает не только картинки, которые в этом теге.
Всем привет кто-нибудь знает почему плагин pagenavi как бы создает пагинацию, но он ее не.
Не работает пагинация
Здравствуйте, подскажите кто сталкивался с подобной проблемой. На этой странице.
не работает пагинация
Привет народ. В общем проблема такова, написал некий код, который выводит определенные данные из.
Не работает пагинация
Не работает пагинатор, при переходе на другую страницу, в строке меняется номер страницы, а на.
прописал следующее в екшене $query = Tasks::find(); $pages = new Pagination(); .
Не работает пагинация
Я искал как сделать пагинацию и наткнулся на сайт metanit (ссылка на статью.
Источник
Некорректная работа при многоразовой инициализации swiper slider`ов на сайте
Проблема заключается в том, что при смене слайда с помощью перемещения мышкой, работает только то выпадающее меню, которое было открыто первым. Прикладываю скрины:
1)Корректная работа первого открытого:
2) А это второе открытое, в той же сессии: (слайдер перестал прокручиваться до конца и исчезла нумерация страниц).
При всем этом, если пользоваться стрелочками для смены слайдов, то во всех случаях, работает правильно.
Если что, вот элементы для подключения swiper slider
Буду очень благодарен, если сможете помочь решить эту проблему, спасибо.
1 ответ 1
Удалось достичь некоторых успехов. В html разметке были добавлены data-id, чтобы можно было использовать их в качестве отдельных переменных для каждого слайдера:
Полностью отредактирован js:
Таким образом все слайдеры работают. Если убрать мышку с контента, то он автоматически переходит на первый слайд. При использовании другого слайдера с первым никаких проблем не возникает и наоборот тоже.
В целом такой результат меня больше чем устраивает, но хочу задать уточняющий вопрос у опытных людей. Можно ли достичь корректной работы многих слайдеров при аналогичной ситуации, но когда при отведении мышки, слайдер остается на том же слайде.
И еще вопрос. В мобильной версии, скролл мышкой работает только после того, как 1 раз нажмешь на контент или на любую из стрелочек, это возможно как-то пофиксить?
Источник
Swiper Changelog
7.0.9 (2021-10-18)
Bug Fixes
- core: Change opacityString and scaleString to originalProgress (#5095) (244cc2e)
- vue: fix SwiperSlide types (114fee7), closes #5069
7.0.8 (2021-10-04)
Features
- virtual: improve behavior with cssMode (b478058)
7.0.7 (2021-09-29)
Bug Fixes
- angular: removed stray setIndex debug code (nolimits4web#5006) (#5007) (59e44ae)
- vue: make swiperRef not required in SwiperSlide vue component (#4992) (1cd6af8)
7.0.6 (2021-09-16)
Bug Fixes
- angular: deprecate [(index)] and setIndex() (#4951) (7ee3d58)
- effect-creative: fix autoplay by watching all slides transition end (86e6fb6), closes #4961
- types: add missing cards effect (#4950) (c18aa08)
Features
- angular: enabled prop (#4949) (6c0a3e5)
- angular: support data-swiper-autoplay (#4946) (d665fb9)
7.0.5 (2021-09-09)
Bug Fixes
- core: don’t auto create elements on destroy/init (b4cdea8)
- core: passes modules shouldn’t extend prototype (f07d43f), closes #4928
7.0.4 (2021-09-08)
Bug Fixes
- core: fix cssMode animation in Safari 14 (7fd04fe), closes #4925
- virtual: fix Virtual slides in React, Vue & Angular (e80925e), closes #4899
Features
- pagination: more pagination bullet CSS variables (#4927) (25416de)
7.0.3 (2021-09-03)
Bug Fixes
- types: effect-creative translate (#4907) (ad8fae3)
7.0.2 (2021-08-31)
Bug Fixes
- a11y: fix argments for initNavEl() method (#4884) (2987700)
- core: reset slides size when slidesPerView switches to auto (2c8784b), closes #4881
- description typo (#4887) (d3c4764)
7.0.1 (2021-08-26)
Bug Fixes
- autoplay: add missing .start() method (dda14bc), closes #4865
- pagination: check for bullets before destroy (ea06b4c), closes #4859
7.0.0 (2021-08-25)
Bug Fixes
- angular: container classNames (#4854) (fd092dc)
- angular: demo (9fa84e6)
- angular: try paths for build/types (04b4eae)
- angular: tsignore (9011756)
- types: make loopSlides & loopCreate & loopDestroy internal (d6fdd1b)
- zoom: zoom elements only in swiper-zoom-container (a4e351f), closes #4847
- keyboard: fix not working keyboard module (31ee849)
- pagination: avoid adding direction classes to other swiper’s pagination’s (f1c8c89)
- core: prevent watchOverflow from unlocking slidePrev/Next (f1b7397)
- scrollbar: fix scrollbar size with centeredSlides (91f2f2f)
- core: fix slide progress in CSS Mode and centered slides (1b0165a)
- core: better handle loop fix with cssMode enabled (ff84073)
- core: fix auto create elements feature with breakpoints (3b50feb)
- components: add modules prop (596e2a1)
- types: add modules parameter (0d599e2)
- core: grab cursor to be set based on touchEventsTarget (cffc3aa)
- core: double check for documentElement in smoothScroll detection (ac09e38)
Features
- creative-effect: add shadowPerProgress parameter (980c4c7)
- angular: better typing (e132ee8)
- angular: better typing (6b562fa)
- angular: support ‘strictTemplates’ flag (613f12c)
- effect-creative: add progressMultipler option (ed3bd7a)
- angular: partial ivy build (#4834) (e86b2b3)
- core swiper-container class to swiper (ad8002c)
- core swiper-container class to swiper (c763c9c)
- core: watchOverflow is now enabled by default (b97286f)
- core: improve watchOverflow detection (627ae4c)
- creative-effect: add shadows (cce4f23)
- cards-effect: add slide shadow (09666c8)
- cards-effect: new Cards effect (21af858)
- creative-effect: add limitProgress and perspective options (1c7d49e)
- core: new «Creative» effect (f72f5ba)
- svelte: add Svelte components typings (5a64bdc)
- core: new slidesPerGroupAuto feature (2b6f133), closes #4168
- coverflow-effect: support cssMode (e13d268)
- fade-effect: support cssMode (18b49cc)
- flip-effect: support cssMode (82859a1)
- pagination: keep pagination styles when it is outside of container (1b11429), closes #3736
- core: better RTL support in CSS Mode (3503ced)
- core: support for centeredSlides in CSS Mode (c940953)
- core: support for coverflow effect in CSS Mode (8300225)
- core: support for Virtual Slides in CSS Mode (0e26d52)
- core: use easing for custom scroll animation (f40a370)
- zoom: support Zoom in CSS Mode (4639702)
- core: watchSlidesProgress and watchSlidesVisibility merged into single watchSlidesProgress (33dbf62)
- core: custom animation for CSS Mode where smooth scrolling is not supported (a61da6a)
- core: remove isEdge browser detection (9c9970c)
- core: move slides manipulation methods to Manipulation module (74873f1)
- core: move slidesPerColumn functionality to new Grid module (0f1df44)
- core: increase package build target (65f96c1)
- core: tweak browserslist (82a23a5)
- core: convert A11y to functional module (5906115)
- core: convert Autoplay to functional module (ace1e54)
- core: convert FreeMode to functional module (4d307c0)
- core: convert Keyboard to functional module (ed63a3b)
- core: convert Lazy to functional module (8d4f99a)
- core: convert Mousewheel to functional module (1e4bf98)
- core: convert Navigation to functional module (e4aa156)
- core: convert Pagination to functional module (1c718d0)
- core: convert Scrollbar to functional module (96b8b17)
- core: convert Thumbs to functional module (bea5ac2)
- core: convert Virtual to functional module (6899e83)
- core: convert Zoom to functional module (eb1437e)
- core: remove object-syntax modules support (287d14a)
- core: touchEventsTarget is now default to wrapper (71ffcb5), closes #4751#3816
- core: convert effects to functional modules (b6f64a5)
- core: convert HashNavigation to functional module (ac384c6)
- core: convert History to functional module (7e7c95a)
- core: convert Observer to functional module (a31b80e)
- core: convert Parallax to functional module (a7c26b5)
- core: convert Resize to functional module (133047c)
- core: new functional modules syntax (e45285a)
- core: remove mouse events listeners in favor of pointer events (b9254ab)
- core: remove MutationObserver support detection (consider it is supported everywhere) (6ed6786)
- core: remove pointerEvents support detection (b7d171b)
- core: resizeObserver is not enabled by default (552a7ea)
- package: use type: module (e8d89f2)
- core: remove CJS formats (3978367)
- core: remove Less and SCSS variables in favor of CSS variables (91e8ea1)
- freeMode: init (#4240) (895da28)
- slidesPerColumn: init (#4508) (c469d29)
6.8.4 (2021-08-23)
Bug Fixes
6.8.3 (2021-08-20)
Bug Fixes
- fix missing package.json in swiper/types
6.8.2 (2021-08-16)
Bug Fixes
- core: support tailwind’s ! in classes (0cfbc53), closes #4812
- vue: add missing emitted events (enable & disable) into ’emits’ option (95665cc)
- vue: fix focusableElements prop type (7f1b1b9), closes #4822
6.8.1 (2021-08-03)
Bug Fixes
- core: reset slides margin-top on slidesPerColumn breakpoint (c94a115), closes #4044
- core: fix server side check for HTMLElement (close #4787) (#4788) (ca4f6b8)
Features
- pagination: hide 1 dot pagination (#4786) (cc5e417)
6.8.0 (2021-07-22)
Bug Fixes
- a11y: count aria-label without duplicated item in loop option (4bd7461), closes #4782#4781
- angular: nested swiper (#4785) (2be958c)
- core: don’t extend html elements in SSR (#4784) (adac257)
- hash-navigation: typos in comments and function name (#4779) (07b8dc3)
- svelte: install modules via module component prop (#4768) (ddaa069), closes #4767
- zoom: fix zoom panning in RTL (08bcd05), closes #4074
6.7.5 (2021-07-01)
Bug Fixes
- lazy: lazy load when no sides resistance enabled (1949a9e), closes #4729
- zoom: compatibility with slidesPerView to zoom only clicked slide (aa1a778), closes #4716
Features
- vue: added Vue components typings (#4707) (c452c08), closes #3916
6.7.1 (2021-06-23)
Bug Fixes
- angular: don’t set main class on wrapper element (1285195), closes #4679
- core: don’t extend html elements (#4691) (32ae99b)
- core: unset top margin on slide when slidesPerColum changed (1ced4f7), closes #4658
- react: dynamically enable/disable navigation/pagination/scrollbar (d87ac0c), closes #4681
- react: update parallax on Virtual slides rendered (ce210f3), closes #4673
- react, svelte, vue: allow to accept enabled prop (76dd086), closes #4633
- svelte: dynamically enable/disable navigation/pagination/scrollbar (8711bb9)
- typings: fixed methods definitions for navigation, pagination and scrollbar (77d6909)
- vue: dynamically enable/disable navigation/pagination/scrollbar (4821008)
- vue: update parallax on Virtual slides rendered (b78c6e0)
Features
- core: add ParallaxOptions types (7cc22fe), closes #4684
- core: allow wrapperClass to be multiple classes (0d578b0), closes #4680
- core: make focusableElements configurable (6ff0866), closes #4677
- core: use window.matchMedia to detect window width for breakpoints (1a4afe0), closes #4682
6.7.0 (2021-05-31)
Bug Fixes
- angular: virtual mode run changeDetecton inside ngZone (#4601) (4f37a61)
- lazy: use passive listener for scroll listeners (cbe7a59)
- thumbs: improve thumbs with slidesPerGroup (b2b31b3), closes #3704#4007#4615#4208
- vue: definition for «lock» and «unlock» events (46d35f7), closes #4596
Features
- core: starter html layout can be optional with new createElements: true parameter (#4507) (aef2865)
- autoplay: if disableOnInteraction and pauseOnMouseEnter , it will stop autoplay on interaction (e7e5031), closes #4598
- vue: add support for use Swiper as async component (ff53797), closes #4613
6.6.2 (2021-05-19)
Bug Fixes
- autoplay: fix resume after pause on mouseenter (3d480be), closes #4569
- navigation: better SCSS interpolation (a1337df)
- svelte: auto update Virtual slides on slides prop change (ddf11b8), closes #4564
6.6.1 (2021-05-11)
Bug Fixes
- core: fix breakpoints enabled detection (0be8099), closes #4543
6.6.0 (2021-05-11)
Bug Fixes
- core: make autoHeight work with Virtual slides (6925acf), closes #4525
- zoom: don’t toggle zoom on slides without zoom-container (e1de61b), closes #4535
Features
- autoplay: new pauseOnMouseEnter parameter to pause autoplay on mouse enter over container (1a10247), closes #4482
- core: new parameters and methods to enable/disable Swiper dynamically (575bc84), closes #4356#4311
- react: add the missing render function type (cfa1459)
6.5.9 (2021-04-30)
Bug Fixes
- angular: custom naviation & pagination (c96bcf6)
- angular: don’t remove Swiper styles on destroy (96ad4f0), closes #4443
- angular: extend current params (71be609)
- angular: pagination true should work (434a19c)
- angular: update value (20e25b5)
- build: size calc (769e9df)
- docs: postinstall bakers-> backers typo (839aea4)
- hash-navigation: fixed issue when using with freeMode without transition (c90a7bd), closes #4478
- history: fixed issue when using with freeMode without transition (2902ea9)
- react: load lazy images (if enabled) on children change (ca0347b), closes #4463
- vue: load lazy images (if enabled) on children change (335daff)
Features
- angular: support id input (ad51e32)
- core-js postinstall script (fd5c01d)
- angular: use class & ngClass on component (66c5a55)
6.5.8 (2021-04-23)
Bug Fixes
- components: fixed issue with navigation, pagination, scrollbar custom elements added after initialization (cfd4efd), closes #4458
- react: make events reactive (301ffb0), closes #3762
Features
- a11y: add a11y.slideRole parameter for custom slide role (097109f), closes #4435
- history: new root parameter to avoid issues with root path detection (e6d1202), closes #3205
6.5.7 (2021-04-16)
Bug Fixes
- react: fixed issue with Virtual, Controller and Thumbs when running React.StrictMode
Features
- core: new swiper.setProgress method to set whole Swiper translate progress (from 0 to 1)
6.5.6 (2021-04-09)
Bug Fixes
- angular: custom html element support (b7d0c1f)
- angular: custom html element support (dec54c2)
6.5.5 (2021-04-08)
Bug Fixes
- core: removed Svelte from peerDependencies
- utils: dom not writeable (8775c1a)
6.5.4 (2021-04-05)
Bug Fixes
- core: fix pagination and a11y classes escaping (49e06f9), closes #4403
- svelte: don’t destroy on server-side (8a8fb62), closes #3961
6.5.3 (2021-03-31)
Bug Fixes
- navigation: fix wrong nav button position (ef97693), closes #4393
6.5.2 (2021-03-30)
Bug Fixes
- core: fix params extending loosing Swiper instance (32092ae), closes #4384
6.5.1 (2021-03-29)
Bug Fixes
- a11y: correct aria-roledescription attribute name (1b73c3b), closes #4371
- core: fixed proto pollution (ec358de)
- core: fixed proto pollution (9dad273)
- isObject cross window (7c36077)
- isObject cross window (95b5dfe)
- update virtual slides (e33242c)
- core: replace unsupported Object.entries (6dff71d), closes #4341
- core: use getComputedStyle helper (9698e58), closes #4337
Features
- a11y.slideLabelMessage (9fd6e68)
- custom html element support (f96db02)
- navigation: set disabled prop on nav element if it is a element (7536fbd), closes #4312
6.5.0 (2021-03-05)
Bug Fixes
- a11y: space should trigger role button (3d4039b)
- core: correctly update slideIndex when other elements are present in slides wrapper (21e7713)
- core: don’t toggle zoom during transition (16f185e), closes #4259
- core: don’t try to move slider when it is locked (51fd048), closes #4284
- e2e: initSwiper (9915f8b)
- lazy: fixed issue with lazy loading when freeMode stops without momentum (82bcc5c), closes #4274#4275
- navigation: don’t hide navigation on pagination click (7b7cccf), closes #4285
- pagination: don’t hide pagination on navigation click (68b8a93), closes #4285
- svelte: fix Svelte cjs exports (478289c), closes #4297
Features
- components: added «resizeObserver» boolean option/prop to enable ResizeObserver (f03ffbb), closes #4244
- core: added support to use ResizeObserver with new «resizeObserver» parameter (5f80052), closes #4244
- core: possible to enable breakpoints based on container width (instead of window width) (42db86d), closes #4244
- init cypress (6159524)
6.4.15 (2021-02-18)
Bug Fixes
- angular, vue, svelte: add ‘observer’, etc. to params-list (8f1cd29)
- core: correctly store class names (02265ec), closes #4247
6.4.14 (2021-02-17)
Bug Fixes
- svelte: add «observer» params support to props (703ea53)
- vue: add «observer» params support to props (1d37ff7)
- fixed error bundling CJS module (0cda5e4), closes #4242
- react: add ‘observer’, etc. to params-list (205c14e)
Features
- angular: thumbs & controller support (76acd28)
6.4.12 (2021-02-16)
Bug Fixes
- angular: autoplay SSR (4f1e9c4)
- angular: don’t enable observer when virtual enabled (8810b18)
- angular: virtual SSR (63fed99)
Performance Improvements
- angular: call swiperRef outside of angular (4e544ef)
6.4.11 (2021-02-06)
Bug Fixes
- angular: BrowserAnimationsModule slides deletion (fef6ebd)
- react: navigation, pagination and scrollbar is not disabled when #4181 (460787d)
- react: correctly check for virtual params (92c0137)
- react: support SwiperSlider components wrapped in higher order components and fix nested fragments bug #4144
- vue: update virtual slides on nextTick (5208b1a), closes #4172
- svelte/vue navigation, pagination and scrollbar is not disabled when false #4181 (ffedb6b)
Features
- angular: use observer to update swiper on slides changes (962a0c0)
- angular: use swipers observer (30dd7c9)
6.4.10 (2021-01-29)
Bug Fixes
- core: don’t throw error when trying to init on non existent element (31aa87a)
- core: fixed issue with «scroll container» (c3d0b97), closes #4161
- react: fixed issut with Virtual Slides not working correctly (c24f7ef), closes #4162
- vue: fixed updating virtual slides on virtual data change (5979102)
6.4.9 — Released on January 28th, 2021
Bug Fixes
- angular: Cannot set property ‘classNames’ of undefined (13bcf39)
- angular: content slider ngIf (4ca13e4)
- angular: tsconfig path (f2dcf16)
- angular: zoom container custom class (5d4f11c)
- core: disable extra grid item for free mode (9159d89), closes #4010
- docs: change url api -> swiper-api (3dc9203)
- docs: heading levels (e8157e6)
- scrollbar: fixed issue when initialized with empty scrollbar.el will throw an error on destroy
- svelte: slots container start & end (b23b4e1)
- zoom: consider window scroll for offsets (60cd60a), closes #4039
Features
- add allcontributors (95b49b1)
- angular: custom classes (acc678a)
6.4.8 — Released on January 22th, 2021
- Core
- Improved default behavior on Windows touch screen devices
- Types
- Some docs comments fixes
6.4.7 — Released on January 21th, 2021
- Types
- Added full docs comments for all Swiper parameters
- Angular
- Proper support for zoom functionality with required extra «zoom» element. Can be enabled with zoom prop on slides, e.g.
- Fixed issue with SSR
- Fixed issue with not working custom pagination.el
6.4.6 — Released on January 20th, 2021
- Core
- edgeSwipeDetection parameter now can receive string ‘prevent’ to prevent system swipe-back navigation
- Fixed issue when with decimal slidesPerView last slide never received «active» class/state
- Cube
- Fixed shadow rendering issues in Chrome
- React/Svelte/Vue/Angular
- Fixed rendering issue when virtual slides used with breakpoints
- Minor fixes
6.4.5 — Released on December 18th, 2020
- Fixed issue with postinstall script
6.4.4 — Released on December 18th, 2020
- Fixed issue with postinstall script
- Now .css files are also available for all components
- Svelte
- Fixed issue with wrong location of .svelte files in package
- Angular
- Types fixes
- Added [config] support to pass all Swiper params as single object (https://github.com/nolimits4web/swiper/commit/f7d21c5f49860fdca62a31ccb62b01a790fd0df3)
- Added (index) active slide binding (https://github.com/nolimits4web/swiper/commit/86670bd7c1b95268919147662383804e664011a7)
- Minor fixes
6.4.1 — Released on December 9th, 2020
- Fixed types errors introduced in 6.4.0
6.4.0 — Released on December 8th, 2020
- All new Swiper Angular components (kudos to @vltansky) 🎉
- React
- Now Swiper won’t cleanup styles on destroy
- Svelte
- Now svelte package contains source .svelte components
- Now Swiper won’t cleanup styles on destroy
- Vue
- Now Swiper won’t cleanup styles on destroy
- Lazy
- Now it has options to check is Swiper also is in view before loading the images (thanks to @ygj6)
- Build
- Fixed sourcemap missing original sources
- Lots of minor fixes
6.3.5 — Released on October 30th, 2020
- Build
- Fixed builds on Windows
- Core
- Fixed no swiping class in shadow component (#3868)
- Typecheck for slideTo ‘s index parameter
6.3.4 — Released on October 20th, 2020
- Vue
- Fixed issue with Maximum recursive updates
6.3.3 — Released on October 9th, 2020
- Core
- Fixed issue with wrong slides calculation when slides have inner scrollbars
- Autoplay
- Now it will continue autoplay if it reaches the end and new slides will be added later
- React
- Fixed issue when slide render function data was set only after interaction
- Minor fixes
6.3.2 — Released on September 28th, 2020
- Svelte
- Fixed issue with throwing error when using breakpoints
6.3.1 — Released on September 25th, 2020
- A11y
- Init module after all other modules initialized
6.3.0 — Released on September 25th, 2020
- A11y
- Added new parameters containerMessage , containerRoleDescriptionMessage and itemRoleDescriptionMessage (#3834 thanks to @jenemde)
- Now SwiperSlide component requires unique virtualIndex to be set so Swiper can know which slide is rendered exactly
- Fixed issue when SwiperSlide was not rendered if used with v-for
- Now SwiperSlide component requires unique virtualIndex to be set so Swiper can know which slide is rendered exactly
All new Swiper Svelte components:
6.2.0 — Released on September 4rd, 2020
All new Swiper Vue.js (v3) components:
6.1.3 — Released on September 3rd, 2020
- Core
- Pagination
- Now it won’t set a11y attributes on customly rendered bullets
- Pagination
- React
- Fixed issue with loop mode and breakpoints not being recalculate slides
6.1.2 — Released on August 17th, 2020
- React
- Fixed issue generating useLayoutEffect warning in Next.js
- Fixed issue with Virtual List in RTL mode
6.1.1 — Released on July 31th, 2020
6.1.0 — Released on July 31th, 2020
- Core
- Mousewheel
- New mousewheel parameters thresholdDelta and thresholdTime (#3720)
- Fixed issue with Navigation and Pagination .less files (#3724)
- Fixed issue with setting proper sideEffects causing some bundlers to not include imported styles (#3708)
- Mousewheel
- React
- Now SwiperSlide accepts render function with isActive , isVisible , isPrev , isNext , isDuplicate props:
- Minor fixes
6.0.4 — Released on July 15th, 2020
- Fixed TS definitions for Swiper React component (#3692)
6.0.3 — Released on July 14th, 2020
- Dom7 updated to latest with correct __proto__ setters/getters
6.0.2 — Released on July 9th, 2020
- React
- Now Swiper will be auto updated if pagination.el , scrollbar.el , navigation.nextEl and navigation.prevEl are passed from later-available refs
6.0.1 — Released on July 7th, 2020
- SCSS:Fixed issue with missing $colors var in Navigation and Pagination
- Fixed Swiper instance argument typings in event handler props
- Added event handler props definitions for modules events
6.0.0 — Released on July 3rd, 2020
New NPM package structure
All scripts transpiled to ES5
New and renamed files (BREAKING CHANGE):
- swiper.less — core Swiper LESS
- swiper.scss — core Swiper SCSS
- swiper-bundle.css — Swiper bundle CSS
- swiper-bundle.js — Swiper bundle JavaScript in UMD format
- swiper-bundle.cjs.js — Swiper bundle JavaScript in CommonJS format
- swiper-bundle.esm.js — Swiper bundle JavaScript in ESM format
- swiper.cjs.js — Swiper core JavaScript in CommonJS format
- swiper.esm.js — Swiper core JavaScript in ESM format
Following imports are now available
- import Swiper from ‘swiper’ — imports core version
- import Swiper from ‘swiper/bundle’ — imports bundle version
- import Swiper from ‘swiper/core’ — imports core version
Components can be imported from core version using named imports, or using direct import:
Full server-side rendering support (SSR) with new parameters:
- userAgent — device user agent, required for some initial detection
- url — required to correctly detect and set initial slide if Hash Navigation or History modules are used
New loopPreventsSlide boolean parameter (by default enabled), that prevents slidePrev/Next transitions while transition is in progress
Full support for Node.js DOM libraries like JSDOM and Domino
Added new onAny(callback) listener to listen for any swiper event
All events now emit swiper instance as a first argument (BREAKING CHANGE)
Added official TypeScript definitions
Updated to use next generation dom7 and ssr-window libraries
All new Swiper React components:
5.4.5 — Released on June 16th, 2020
- Core
- Fixed issue when checkOverflow method could throw error if Navigation module wasn’t installed (#3621)
- Keyboard
- New parameter pageUpDown to enable/disable pageUp and pageDown keys (enabled by default)
5.4.3 — Released on June 13th, 2020
- Core
- Removed UIWebView text from code
- Fixed resize handler calling slideTo to last slide when it shouldn’t
5.4.2 — Released on June 3rd, 2020
- Mousewheel
- Fixed issue when enabling forceToAxis also inverted scrolling
- Coverflow Effect
- Added support for scale parameter (#3598)
- Pagination
- Fixed detection of uniqueNavElements (#3590)
5.4.1 — Released on May 20th, 2020
5.4.0 — Released on May 15th, 2020
- Hash Navigation
- Added hashChange and hashSet events (#3557)
- Lazy
- Added support for
lazy loading (#3560)
- Added support for
- Mousewheel
- Potentially improved vertical scrolling issues on Windows/Linux OS
- Updated ssr-window and dom7 dependencies to latest versions
- Minor fixes
5.3.8 — Released on April 24th, 2020
- Core
- Fix iOS bug with double bounce on free mode momentum bounce
- A11y
- Fixed focus ring on navigation buttons (#3544)
- Fixed RegExp issue in paginationBulletMessage (#3540, #3541)
- Thumbs
- Added thumbs.autoScrollOffset parameter that allows to set on what thumbs active slide from edge. It should automatically move scroll thumbs
- Minor fixes
5.3.7 — Released on April 10th, 2020
- Core
- Fixed cssMode behavior in RTL layout
- Zoom
- Fixed issue with not working double-tap to toggle with virtual slides
- Minor fixes
5.3.6 — Released on February 29th, 2020
- Core
- Fixed wrong auto height calculation with centeredSlides enabled
- Lazy
- Now it will update auto height (if enabled) on lazy image loaded (#3466)
- Zoom
- Fixed issue when previously active slide could be zoomed with zoom.in() API (#3451)
- Fixed issue when zoom didn’t work on
element (#3456)
- Added support for custom zoom-target element by adding swiper-zoom-target class to such elements
- Coverflow Effect
- stretch parameter now can be set in % (#3468)
- Minor fixes
5.3.1 — Released on February 8th, 2020
- Core
- Fixed issue when slider could stuck after last slide (#3414)
- Added label to list of form events to keep clicks on it (#3407)
5.3.0 — Released on January 11th, 2020
- Core
- New slidesPerGroupSkip behavior (#3361)
- New ratio-based breakpoints (#3389)
- Added SCSS interpolation (#3373, #3374)
- Mousehweel
- Fixed issue when it can fail on load (#3383)
- Minor fixes
5.2.1 — Released on November 16th, 2019
- Core
- New loop events beforeLoopFix and loopFix
- New parameter updateOnWindowResize (by default true ) that will update/recalc swiper on window resize/orientationchange
- Added SCSS interpolation for —swiper-theme-color variable when not building from source (#3334)
- Quote SCSS color names (#3316)
- Fixed issue when .once could be called more than once (#3322)
- Mousewheel
- Fixed scroll wheel unwanted frozen effect (#3328)
- Thumbs
- New multipleActiveThumbs (by default true ) option to control whether multiple thumbnail slides may get activated or not.
- Minor fixes
5.2.0 — Released on October 26th, 2019
- Core
- New centeredSlidesBounds parameter that when enabled will keep first and last slides at bounds
- Fixed issue when freeMode could break position on resize (#2708, #3303)
- Fixed transition duration issue with freeModeSticky (#3302)
- Fixed issue with wrong row/column if not full groups (#3294)
- Fixed issue when watchOverflow and slidesOffsetBefore / slidesOffsetAfter couldn’t work together (#3291)
- Mousewheel
- Faster & smoother mousewheel inertial scrolling (#3304)
- Package
- Added source maps to package builds (#3306)
- Added minified version of browser.esm.bundle
- Minor fixes
5.1.0 — Released on October 16th, 2019
- Core
- Fixed issues with touch on iOS 13
- New translateTo method #3268
- Pagination
- Improved dynamic bullets behavior when loop: true #3255
- Zoom
- Fixed issue with pinch to zoom on Android
- Minor fixes
5.0.4 — Released on September 30th, 2019
- Core
- Now on short swipes over navigation buttons, it will treat it like nav button click (#3237 by @robpop)
- Fixed issue when passing float slidesPerView could break loop mode (#3225 by @robpop)
- Scrollbar
- Fixed issue with wrong «pointer» position calculation on scroll bar tap
- Autoplay
- Fixed issue when it was paused after returning from hidden tab
- Minor fixes
5.0.3 — Released on September 19th, 2019
- Core
- touchEventsTarget defaults back to container
- Added handling of touchcancel event #3219
- Fixed issue with wrong order calculation in slidesPerColumnFill: ‘row’ mode
- Fixed issue with slides missplacing when prepending slides in virtual mode
- Fixed issue when zoomed image still swiped to another slide on mobiles
5.0.1 — Released on September 17th, 2019
5.0.0 — Released on September 17th, 2019
- Core
- All new CSS Scroll Snap mode (can be enabled with cssMode: true ). It doesn’t support all of Swiper’s features, but potentially should bring a much better performance in simple configurations
- Fully removed Internet Explorer support
- breakpointsInverse parameter has been removed and now breakpoints behave like with breakpointsInverse: true before.
- touchMoveStopPropagation parameter now defaults to false
- click event won’t be fired with 300ms delay anymore. Now it will be fired at the same time as tap event
- When slidesPerColumnFill: ‘column’ it now uses flex-direction: column layout which requires specified height on swiper-container
- touchEventsTarget now defaults to wrapper (rather than container like before)
- slidesPerColumn now can be used with breakpoints
- Now Swiper styles use CSS Custom Properties (CSS Custom Variables) to specify swiper’s color theme (color of navigation buttons/pagination). It is now —swiper-theme-color: #007aff;
- Improved es module «tree-shake-ability»
- New swiper.esm.browser.bundle.js package that can be used directly in browser ( import Swiper from ‘swiper.esm.browser.bundle.js’ )
- Autoplay
- Now it will be paused when document becomes hidden (in not active tab) and continued again when document becomes visible
- Lazy
- Swiper preloader image replaced with a little bit simpler loader. Now its color can be changed with —swiper-preloader-color CSS custom property (which is defaults to —swiper-theme-color )
- Pagination
- Active pagination bullets and pagination theme colors now use CSS Custom Properties. It can be defined with —swiper-pagination-color property (which is defaults to —swiper-theme-color )
- Navigation
- Navigation icons reworked with built-in (base64) icon font. It allows to apply any color and size without replacing image
- Navigation buttons colors now use CSS Custom Properties. It can be defined with —swiper-navigation-color property (which is defaults to —swiper-theme-color )
- With —swiper-navigation-size (defaults to 44px ) it is now possible to change size of the navigation buttons (and icons)
- Minor fixes and improvements
4.5.1 — Released on September 13th, 2019
- Core
- Fixed issue when callbacks fires on init even if it disabled (#2807)
- Fixed issue when «swiper-slide-visible» class name in some situations shows up when it shouldn’t
- slidesPerColumnFill: ‘row’ now considers groups (#3077)
- Thumbs
- Fixes bug ‘Cannot read property indexOf of undefined’ that sometimes occurs on use of thumbnails
- Keyboard
- Added PageUp / PageDown keybindings.
- Autoplay
- Fixed issue when window resize stopped autoplay
- Parallax
- Fixed issue when parallax opacity didn’t work (#3147)
- Minor fixes and improvements
4.5.0 — Released on February 22nd, 2019
- Core
- New swiper.changeDirection() method to change direction from horizontal to vertical (and back) dynamically
- direction parameter can be used in breakpoints
- Virtual Slides
- swiper.virtual.appendSlide now accepts array of slides to add
- swiper.virtual.prependSlide now accepts array of slides to prepend
- New swiper.virtual.removeSlide(indexes) to remove virtual selected slides
- New swiper.virtual.removeAllSlides() to remove all virtual slides
- Navigation
- Now it emits navigationHide and navigationShow events when on nav hide/show
- Pagination
- Now it emits paginationHide and paginationShow events when on pagination hide/show
- Dom7 updated to latest 2.1.3
- Fixed issue when .once bound event could still be there after unbinding it with .off
- Source
- Source styles are now available in SCSS in addition to LESS
- Minor fixes and improvements
4.4.6 — Released on December 19th, 2018
- Core
- Fixed issue with wrong slide size calculation in some cases
4.4.5 — Released on December 14th, 2018
- Core
- New observeSlideChildren parameter to enable auto update on slide children update
- Fixed issue when slide padding was not considered when calculating sizes
- Fixed issue with wrong touch support detection on Windows Chrome
- Fixed some issues with wrong slides grid calculation in multi row mode
- Zoom
- Now it emits zoomChange event with scale , imageEl and slideEl arguments
- Minor fixes
4.4.2 — Released on November 1st, 2018
- New touchStartForcePreventDefault parameter to force touch start event prevent default
- Breakpoints fix when breakpoint keys are strings
- Fixed issue when draggable scrollbar may not work on desktop Safari
- Fixed issue with wrong sort of Virtual Slides
- Minor fixes
4.4.1 — Released on September 14th, 2018
- Fixed issue with preventing touchstart event
4.4.0 — Released on September 14th, 2018
- Core
- New centerInsufficientSlides parameter to center slides if the amount of slides less than slidesPerView
- New breakpointsInverse parameter (boolean), if enabled then it will count breakpoints in reversed direction, e.g. will override parameters if window width is more than specified breakpoint
- Virtual Slides
- New addSlidesBefore and addSlidesAfter parameters to increase amount of pre-rendered slides
- Thumbs
- All new «Thumbs» module/component designed to control slider thumbnails, in more logical and correct way than with Controller module.
- Lots of minor fixes
4.3.5 — Released on July 31th, 2018
- Core
- iOSEdgeSwipeThreshold parameter renamed to just edgeSwipeThreshold . Old iOSEdgeSwipeThreshold name is still supported
- Improved observer performance if there are many mutations at a time. Thanks to @rayvincent-bsd
- Controller
- Fixed issue with wrong auto height resizing
- Scrollbar
- Fixed issue when it was using active event listeners instead of passive. Thanks to @nyon
- Minor fixes
4.3.3 — Released on June 5th, 2018
- Core
- Fixed issue when slidePrev goes to wrong slide #2650
- Fixed issue when roundLength was not considered for grids calculation #2656
- Fixed typo in API #2659
4.3.2 — Released on June 1st, 2018
- Core
- Added addSlide(index, slide) method to add slide at required position. Thanks to @kochizufan
- Fixed issue with loop #2647. Thanks to @kochizufan
- Pagination
- New formatFractionCurrent(number) parameter to format current number in Fraction pagination
- New formatFractionTotal(number) parameter to format total number in Fraction pagination
- Minor fixes
4.3.0 — Released on May 27th, 2018
- Core
- Fixed issue when swipeBack sometimes slides to wrong slide
- Fixed issue when window resizing can break Coverflow effect layout
- Fixed issue with wrong detection of iOSEdgeSwipeDetection . Thanks to @langjun
- Dom7 update to latest v2.0.6:
- Fixed issue with remove event listeners when they was not added
- Minor fixes
4.2.6 — Released on May 1st, 2018
4.2.5 — Released on April 29th, 2018
- Core
- Prevent apply grab cursor when swiper is locked
- Fixed breakpoint with loop getting wrong realIndex when on init
- Fixed «transformed» slides sizes calculation that could cause issues in with Coverflow effect
- Autoplay
- Fixed issue that can cause memory leak
- Dom7 update to latest
- Improved internal events proxies logic for better memory management
- Minor fixes
4.2.2 — Released on April 1st, 2018
- Core
- Respect and update breakpoints when calling Swiper’s .update() method
- Pagination
- New progressbarOpposite parameter to make pagination progressbar opposite to direction parameter, means vertical progressbar for horizontal swiper direction and horizontal progressbar for vertical swiper direction
- Mousewheel
- Fixed issue in loop + freeMode for loop not being set correctly
- Minor fixes
4.2.0 — Released on March 16th, 2018
- Core
- swiper.updateAutoHeight(speed) now supports speed parameter to resize swiper wrapper with duration
- Fixed issues in free mode with freeModeSticky not being able to snap to closest snap point
- New swiper.slideToClosest() method to slide to closest snap point when it is somewhere in between
- A11y (Accessibility)
- It is now enabled by default (if installed)
- Controller
- Fixed RTL issue when vertical swiper controls horizontal one
- Lazy
- Fixed issue when lazy loading not always triggered on window resize
- Minor fixes
4.1.6 — Released on February 11th, 2018
- Fixed onTouchMoveOpposite event on touch devices
4.1.5 — Released on February 10th, 2018
- Improved touch events support on desktop Windows devices with touch screen
- Improved «loop fix» when slider is in the free mode
- New noSwipingSelector parameter that can be used instead of noSwipingClass
- New preventIntercationOnTransition parameter to prevent interaction during slice change transition
- New .slideToLoop method to be used in loop mode
- Fixed issue with slideChange events being fired when slide wasn’t actually changed
- Scrollbar
- Now doesn’t require to enable simulateTouch for desktops when it is draggable
- Keyboard
- Fixed detection statement whether a swiper is in the viewport
- Pagination
- Added new multiple main bullets support for dynamic bullets pagination
- Zoom
- Now supports Virtual Slides
- Minor fixes
4.1.0 — Released on January 13th, 2018
- Improved IE 10 support. But it is recommended to use proto polyfill
- Improved touch support for Edge
- New watchOverflow (disabled by default). When enabled Swiper will be disabled and hide navigation buttons on case there are not enough slides for sliding
- Autoplay
- New reverseDirection to enable autoplay in reverse direction
- New waitForTransition parameter when autoplay will wait for wrapper transition to continue (enabled by default). Can be disabled in case of using Virtual Translate when your slider may not have transition
- Keyboard
- New onlyInViewport parameter (enabled by default). When enabled it will control sliders that are currently in viewport
4.0.7 — Released on November 28th, 2017
- Fixed issue with not working correctly touchReleaseOnEdges on iOS
- Fixed issue with not working allowSlideNext/Prev change on Breakpoints
- Fixed wrong scrollbar dragging when using custom dragSize
- Minor fixes
4.0.6 — Released on November 13th, 2017
- Fixed Coverflow effect issue using with breakpoints
- iOSEdgeSwipeDetection will also be in consideration with right-edge swipe
- Fixed freeModeSticky behavior in RTL mode
- Swiper now emits breakpoint event on breakpoint change
- Minor fixes
4.0.5 — Released on November 7th, 2017
- Fixed issue with not working noSwiping parameter
- Parallax now considers slidesPerGroup parameter
- Zoom: improved gestures handling
- Pagination: fixed issues with wrong positioned dynamic-bullets when there are not enough slides
- Fixed issues with some effects being broken with enabled breakpoints
- Minor fixes
4.0.3 — Released on October 27th, 2017
- Fixed Parallax opacity and scale transitions
- Better compatability with SSR by using dummy document object
- Fixed styles for dynamic pagination buttons in RTL mode
- Fixed issue with last pagination button not being active with slidesPerView: ‘auto’
- Renamed build tasks: build-dev -> build:dev , build-prod -> build:prod
4.0.2 — Released on October 18th, 2017
- Lazy loading support for Virtual slides
- Added beforeResize event
- Minor fixes
4.0.1 — Released on October 11th, 2017
- Fixed issue with pagination being broken with loop mode
- Reworked realIndex calculation ordering
- ES-module files renamed (possible breaking change):
- swiper.module.js -> swiper.esm.bundle.js (exported by default)
- swiper.modular.js -> swiper.esm.js
- Minor fixes
4.0.0 — Released on October 4th, 2017 🎉
- New API (check Documentation)
- Virtual Slides — new module that keeps in DOM just required amount of slides
- Source code has been fully rewritten in ES-next syntax
- Dist package contains additional ES-next modules:
- swiper.module.js — swiper bundle for import Swiper from ‘swiper’
- swiper.modular.js — modular version for using Swiper with required components only
- New scripts/build-config.js for creating custom Swiper build with required components and custom color theme
- jQuery version of Swiper has been removed
- Improved compatibility with server-side rendering
- Hundreds of improvements and fixes
4.0.0-beta.4 — Released on September 20th, 2017
- Fixed issue with draggable Scrollbar in RTL layout
- Minor fixes
4.0.0-beta.3 — Released on September 13th, 2017
- Dom7 update to latest version
- Small core refactoring to get better results within tree-shaking bundles
4.0.0-beta.2 — Released on September 2nd, 2017
- Disable a11y by default
- Fixed issue with events sharing between multiple swipers
- Fixed issue with resize handling after destroy
- Few minor fixes
4.0.0-beta.1 — Released on August 30th, 2017
3.4.2 — Released on March 10th, 2017
- Fixed an issue with lazy loading callbacks when swiper is destroyed
- New onAfterResize and onBeforeResize callbacks
- New onKeyPress callback when keyboard control is used
- Fixed Chrome+Windows issue with not clickable links that have «title» attribute
- Minor fixes
3.4.1 — Released on December 13th, 2016
- Fixed Zoom for RTL
- Improved slideToClickedSlide behavior when loop is enabled
- Minor fixes
3.4.0 — Released on October 16th, 2016
- Custom build available. Now you can create custom swiper build using the folowing modules: effects, lazy-load, scrollbar, controller, hashnav, history, keyboard, mousewheel, parallax, zoom, a11y. Using cli gulp custom -zoom,effects,lazy-loading
- New zoom functionality that enables double tap and pinch to zoom slide’s inner image:
- Required slide layout for zoom:
- New zoom parameters:
- zoom — enable zoom functionality
- zoomMax — maximum image zoom multiplier, by default is 3
- zoomMin — minimum image zoom multiplier, by default is 1
- zoomToggle — enable/disable zoom-in by slide’s double tap
- zoomMax can be also overridden for specific slide by using data-swiper-zoom attribute
- New swiper.enableTouchControl() and swiper.disableTouchControl() methods to enable disable touch control (it toggles onlyExternal parameter)
- New swiper.realIndex property in addition to swiper.activeIndex that returns index of active slide considering loop
- New History API with new history parameter. It uses history pushState to set active slide URL
- New hashnavWatchState parameter to navigate through slides (when hashnav is enabled) by browser history or by setting directly hash on document location
- New replaceState parameter that work in addition to hashnav or history to replace current url state with the new one instead of adding it to history
- New methods s.unsetGrabCursor() and s.setGrabCursor() to enable/disable grab cursor
- Draggable Scrollbar now works when simulateTouch:false
- New normalizeSlideIndex parameter to improve work of controller (see #1766)
- lazyLoadingInPrevNextAmount now works with slidesPerView: ‘auto’
- New passiveListeners parameter to use passive event listeners to improve scrolling performance on mobile devices. Enabled by default
- New freeModeMomentumVelocityRatio parameter to control moment velocity
- Now it is possible to specify autoplay delay for every (or specific) slides by using data-swiper-autoplay attribute on them
- Lazy loading now also respects sizes responsive images attribute
- Improved mousewheel cross browser behavior (see #1797)
- New mousewheelEventsTarged parameter (by default ‘container’) where you can specify mousewheel events target
- New onScroll event/callback that triggers when swiping/scrolling happens with mousewheel
- New touchReleaseOnEdges parameter to release touch events on slider edge position (beginning, end) and allow for further page scrolling
- Multirow (slidesPerColumn) support for vertical direction, which is in this case becomes multicolumn
- paginationBulletRender now accepts swiper instance as a first argument, paginationBulletRender(index, className) -> paginationBulletRender(swiper, index, className)
- New «swiper-slide-duplicate-active», «swiper-slide-duplicate-next», «swiper-slide-duplicate-prev» classes that will be added in loop mode to the slides representing duplicated looped slides
- All css classes are now configurable via new parameters: lazyLoadingClass, notificationClass, containerModifierClass, paginationClickableClass, paginationModifierClass, lazyStatusLoadingClass, lazyStatusLoadedClass, lazyPreloaderClass, notificationClass, preloaderClass, zoomContainerClass, slideDuplicateActiveClass, slideDuplicateNextClass, slideDuplicatePrevClass
3.3.1 — Released on February 7th, 2016
- New uniqueNavElements parameter. If enabled (by default) and navigation elements’ parameters passed as the string (like .pagination ) then Swiper will look for such elements through child elements first. Applies for pagination, prev/next buttons and scrollbar
- New onPaginationRendered callback. Will be fired after pagination elements generated and added to DOM
- New .reLoop() method, which combines .destroyLoop() + .createLoop() methods with additional positioning fixes. Useful to call after you have changed slidesPerView parameter, it will dynamically recreate duplicated slides required for loop
- New .nextButton and .prevButton properties with Dom7/jQuery element with next/prev button HTML element
- Fixed not working mousewheel control in IE 11
- Fixed issue with lazy loading images not being recalculated after window resize
- Fixed issues when using loop with breakpoints changing slidesPerView/Group parameters
- Numerous minor fixes
3.3.0 — Released on January 10th, 2016
- New 3D Flip effect. Can be enabled with `effect: ‘flip’ parameter
- New types of pagination with new parameters:
- paginationType — type of pagination. Can be ‘bullets’ (default) or ‘fraction’ or ‘progress’ or ‘custom’
- paginationFractionRender(swiper, currentClass, totalClass) — custom function to render «fraction» type pagination
- paginationProgressRender(swiper, progressbarClass) — custom function to render «progress» type pagination
- paginationCustomRender(swiper, current, total) — custom function to render «custom» type pagination
- New lazyLoadingInPrevNextAmount parameter allows to lazy load images in specified amount of next/prev slides
- New autoplayStopOnLast parameter ( true by default) tells to autoplay should it stop on last slide or start from first slide
- New onAutoplay(swiper) callback
- Minor fixes
3.2.7 — Released on December 7th, 2015
- Fixed issue with using HTMLElements for next/prevButton parameters with breakpoints
- Fixed issue with not working Auto Height when using Controller
3.2.6 — Released on November 28th, 2015
- Fixed issue in RTL layout using mousewheelControl
- Fixed issue in RTL layout using Parallax
3.2.5 — Released on November 21st, 2015
- New «Auto Height» mode when container/wrapper adapts to the height of currently active slide. Can be enabled with autoHeight: true parameter
- Fixed issue with breakpoints in Firefox
- Fixed issue with wrong slides position when using effects
- Fixed issue with none-updated scroll bar after using setWrapperTranslate
- Minor fixes
3.2.0 — Released on November 7th, 2015
Added responsive breakpoints support using new breakpoints parameter. Now you can specify different slidesPerView and other similar parameters for different sizes:
New callbacks: onSlideNextStart , onSlideNextEnd , onSlidePrevStart , onSlidePrevEnd
Added Meteor package meteor add nolimits4web:swiper
Fixed issue with mouse touchMove/End callbacks firing all the time
Источник