如何使用 loryjs 減少移動設備中的幻燈片 | Javascript

Question

由於代碼簡單，無依賴，我在我的項目中使用了loryjs 。 一切都很好，除了它的響應能力

它在桌面上顯示 4 張幻燈片，在移動設備上顯示 4 張幻燈片（寬度減小），

我希望它在桌面上顯示 4 張幻燈片，在移動設備上顯示幻燈片我怎樣才能做到這一點

Answer 1

用戶斷點
例如：

const options = [
    {
      breakpoint: null,
      settings: {
        infinite: 1,
      },
    },
    {
      breakpoint: '(min-width: 43.75em)',
      settings: {
        infinite: 2,
      },
    },
    {
      breakpoint: '(min-width: 75em)',
      settings: {
        infinite: 4,
      },
    },
  ];

也許這個鏈接會幫助你

這是我在 Slick Carousel 中使用的代碼以使其具有響應性

slideConfig = {
    'slidesToShow': 5,
    'slidesToScroll': 5,
    'dots' : true,
    'infinite': false,
    'responsive': [
      {
        breakpoint: 1050,
        settings: {
          'slidesToShow': 3,
          'slidesToScroll': 3,
        }
      },
      {
        breakpoint: 600,
        settings: {
          'slidesToShow': 2,
          'slidesToScroll': 2,
        }
      },
    ],

  };