響應式設定(RWD)

提示

注意這裡的設置是從小到大的設定 (參考Bootstrap RWD 設計)，使用覆蓋的方法

如果需要不同尺寸使用不同的顯示方式，可以試試這個

<AcroolCarousel
    // ...ignore some 
    slidesPerView={1}
    height={{widthRatio: 22, heightRatio: 9}}
    isEnablePagination
    isEnableLoop
    breakpoints={{
        768: {
            slidesPerView: 2,
            height: {widthRatio: 16, heightRatio: 9},
            isEnableLoop: false,
            isEnablePagination: false,
            isEnableNavButton: false,
        },
        1200: {
            slidesPerView: 4,
            height: {widthRatio: 32, heightRatio: 9},
            isEnableLoop: true,
            isEnablePagination: true,
            isEnableNavButton: true,
        }
    }}
/>

拖動瀏覽器視窗的尺寸試試看？