angular-swiper icon indicating copy to clipboard operation
angular-swiper copied to clipboard

Breakpoints

Open naumanahmed19 opened this issue 9 years ago • 2 comments

Hi, I am trying to use breakpoint object but its not working for me. Can you please tell me how to use it.

Here is my code

<ks-swiper-container
        initial-slide="1"
        loop="true"
        show-nav-buttons="true"
        slides-per-view="3"
        space-between="5"
        autoplay="2500"
        pagination-clickable="false"
        override-parameters="{'centeredSlides':'true','breakpoints': {'320': {'slidesPerView': '1'}}}">
    <ks-swiper-slide class="swiper-slide" ng-repeat="slide in slides">
        <img ng-src="{{slide.image}}">
    </ks-swiper-slide>
</ks-swiper-container>

naumanahmed19 avatar Aug 20 '16 23:08 naumanahmed19

Try to use numbers for the breakpoint values instead of strings:

override-parameters="{'centeredSlides':'true','breakpoints': {320: {'slidesPerView': '1'}}}"> <ks-swiper-slide class="swiper-slide" ng-repeat="slide in slides"

Also, please note that the breakpoint is set for the lower limit. "320" applies for screens smaller than 320px which is not very likely to happen. See the official documentation for details: http://idangero.us/swiper/api/

markuspalme avatar Oct 12 '16 14:10 markuspalme

No that won't work, we need to increase the version of swiper dependency as breakpoints are available from ^3.2.0 by swiper

ghost avatar May 13 '17 00:05 ghost