Question

我有一个工作滑块。我想自动播放幻灯片，并在用户单击下一个或上一个按钮时停止自动播放。

我试图包括setInterval-function，但是我不确定如何应用它才能使它起作用。到目前为止，我还没有做到这一点。

在此处输入代码

var interleaveOffset = 0.2;

var swiperOptions = {
  loop: true,
  speed: 500,
  grabCursor: true,
  watchSlidesProgress: true,
  mousewheelControl: true,
  keyboardControl: true,
  navigation: {
    nextEl: ".swiper-button-next",
    prevEl: ".swiper-button-prev"
  },
  on: {
    progress: function() {
      var swiper = this;
      for (var i = 0; i < swiper.slides.length; i++) {
        var slideProgress = swiper.slides[i].progress;
        var innerOffset = swiper.width * interleaveOffset;
        var innerTranslate = slideProgress * innerOffset;
        swiper.slides[i].querySelector(".slide-inner").style.transform =
          "translate3d(" + innerTranslate + "px, 0, 0)";
      }      
    },
    touchStart: function() {
      var swiper = this;
      for (var i = 0; i < swiper.slides.length; i++) {
        swiper.slides[i].style.transition = "";
      }
    },
    setTransition: function(speed) {
      var swiper = this;
      for (var i = 0; i < swiper.slides.length; i++) {
        swiper.slides[i].style.transition = speed + "ms";
        swiper.slides[i].querySelector(".slide-inner").style.transition =
          speed + "ms";
      }
    }
  }
};

var swiper = new Swiper(".swiper-container", swiperOptions);

我希望滑块自动播放幻灯片，并且当用户单击下一个或上一个按钮时，自动播放会停止。

Answer 1

使用autoplay

autoplay: {
        delay: 2500,
        disableOnInteraction: true,
},

disableOnInteraction将在您单击箭头时禁用自动播放。

Answer 2

在我的头顶上，您可以使用类似的东西

WITH pivot_data AS(
    SELECT va.identity,
    vc.units,
    s.field_name "Sample ID",
    s.id_text "Lab ID",
  TO_CHAR(str.result_value, S_FORMATMASK_PACKAGE.s_FormatMask(vc.analysis, s.id_numeric))result_value
  FROM sample s
  LEFT OUTER JOIN client c                ON c.id                 = s.client_id
  LEFT OUTER JOIN samp_test_result str    ON (s.id_numeric        = str.id_numeric
                                          AND s.id_text            = str.id_text and str.result_value is not null)
  LEFT OUTER JOIN versioned_analysis va   ON (va.identity         = str.analysis)
  LEFT OUTER JOIN versioned_component vc  ON (vc.analysis         = va.identity
                                          AND vc.analysis_version = va.analysis_version
                                          AND vc.name             = str.component_name)
  WHERE s.fas_sample_type = sample_pkg.get_leaf_sample
  AND s.status            = sample_pkg.get_authorised_sample
  AND s.flg_released      = constant_pkg.get_true
  AND vc.flg_report       = constant_pkg.get_true
  AND c.id = UPPER ('I000009')
  AND s.ID_NUMERIC between TO_NUMBER(2126) and TO_NUMBER(12917) and str.result_value <> 0
  )
SELECT pvt1.*
FROM(SELECT * FROM pivot_data PIVOT (MAX(result_value) result_value, MAX(units) units  FOR identity IN('NIR_N' "Nitrogen",
                                                                                                  'XRF_P' "Phosphorus",
                                                                                                  'XRF_K' "Potassium", 
                                                                                                  'XRF_CA' "Calcium",
                                                                                                  'XRF_MG' "Magnesium",
                                                                                                  'XRF_S' "Sulphur",
                                                                                                  'XRF_SI' "Silicon",
                                                                                                  'XRF_ZN' "Zinc", 
                                                                                                  'XRF_MN' "Manganese", 
                                                                                                  'XRF_CU' "Copper", 
                                                                                                  'XRF_FE' "Iron")))  pvt1

我没有尝试过，但是Swiper文档没有显示除let timer = null const startSwiping = () => { timer = setInterval(() => { swiper.slideNext(100); // transition duration (ms) as argument }, 500) } const stopSwiping = () => clearInterval(timer)之外的任何其他选项

将setInterval和clearInterval放在哪里

2 个答案: