JavaScript slider 插件 MightySlider - 需要延迟解决方法

Question

我购买了一个名为 MightySlider 的 slider 插件 http://codecanyon.net/item/mightyslider-responsive-multipurpose-slider/5898508我需要一个简单的自动轮播，它可以从头到尾平滑地滚动，然后循环或反转方向。我已经通过将“速度”和“循环:{pauseTime}”参数设置为相等来进行足够的设置，以允许从头到尾平滑滚动。不，我有 20 秒的延迟(等于 slider 的速度)。

这是一个很遥远的事情，但是任何人都可以帮助解决这个问题的参数，或者帮助我编写一个 javascript hack 来触发 slider 在页面加载时或 1-2 秒后开始移动吗？或者，有人可以推荐不同的 slider 吗？

网站在这里:http://smmcnyc.com/work/1919market/

JSFiddle 在这里:https://jsfiddle.net/fhhdxnum/

    $(".frame").mightySlider({
     // Mixed options
      moveBy:       9000,        // Speed in pixels per second used by forward and backward buttons.
      speed:        20000,        // Animations speed in milliseconds. 0 to disable animations.
      easing:       'linear',    // Easing for duration based (tweening) animations.
      startAt:      10000,          // Starting offset in slides.
      startRandom:  0,          // Starting offset in slides randomly, where: 1 = random, 0 = disable.
      viewport:     'fill',     // Sets the cover image resizing method used to fit content within the viewport. Can be: 'center', 'fit', 'fill', 'stretch'.
      autoScale:    0,          // Automatically updates slider height based on base width.
      autoResize:   0,          // Auto resize the slider when active slide is bigger than slider FRAME.
      videoFrame:   null,       // The URL of the video frame to play videos with your custom player.
      preloadMode:  'nearby',   // Preloading mode for slides covers. Can be: 'all', 'nearby', 'instant'.

      // Scrolling
      scrolling: {
        scrollSource: null, // Selector or DOM element for catching the mouse wheel scrolling. Default is FRAME.
        scrollBy:     0,    // Slides to move per one mouse scroll. 0 to disable scrolling.
        hijack:       300   // Milliseconds since last wheel event after which it is acceptable to hijack global scroll.
      },

      // Pages
      pages: {
        pagesBar:       null, // Selector or DOM element for pages bar container.
        activateOn:     null, // Event used to activate page. Can be: click, mouseenter, ...
        pageBuilder:          // Page item generator.
          function (index) {
            return '<li>' + (index + 1) + '</li>';
          }
      },

      // Automated cycling
      cycling: {
        cycleBy:       'pages', // Enable automatic cycling by 'slides' or 'pages'.
        pauseTime:     20000, // Delay between cycles in milliseconds.
        loop:          1,    // Repeat cycling when last slide/page is activated.
        pauseOnHover:  0,    // Pause cycling when mouse hovers over the FRAME.
        startPaused:   0     // Whether to start in paused sate.
      },

    });  

建议或解决方法会非常有帮助!

Answer 1

尝试 nivo slider 。

如果您购买了 slider ，您可以要求客户支持来执行此操作。

更改骑行停留时间:

 cycling: {
    cycleBy:       'pages', 
    pauseTime:     1000,

或者如果这不适合您:

我不确定这是否是最好的方法，但这就是您可以做到的方法。您需要编辑 mightyslider.js

向下滚动到函数 requestHandler 并在 timestamp=_now(); 添加(第 ~2728 行)。如果 onLoadStart 为 true，这些行将开始滑动循环。

if(o.cycling.onLoadStart){
    o.cycling.onLoadStart += -50;
    if(o.cycling.onLoadStart == 0 || o.cycling.onLoadStart == true){
        cyclingActivate();
        o.cycling.onLoadStart = false;
    }
} 

将此值添加到 mightySlider.defaults 数组行 ~6648

    // Automated cycling
    cycling: {
        .........................
        startPaused:   false,
        onLoadStart:   true
   }

现在您可以将附加选项传递给 mightySlider

 $(".frame").mightySlider({
     ........
     // Automated cycling
      cycling: {
        ..........
        startPaused:   0,
        onLoadStart: 1000    // true -- start immediately after load, 
                             // false --- with delayed start, 
                             // or enter time in miliseconds which is iess than delayed start.     
      }
    ...............
 });