Question

我购买了一个名为MightySlider http://codecanyon.net/item/mightyslider-responsive-multipurpose-slider/5898508的滑块插件我需要一个简单的自动旋转木马，从开始到结束顺畅滚动，然后循环或反转方向。我已经玩了足够的设置，通过设置'speed'和'cycling：{pauseTime}'参数来从头到尾顺利滚动。不，我有20秒的延迟（等于滑块的速度）。

这是一个很长的镜头，但任何人都可以帮助这个参数或帮我写一个javascript黑客触发滑块开始移动页面加载或1-2s后？或者，任何人都可以推荐一个不同的滑块吗？

网站位于：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滑块。

如果您购买了滑块，可以请客户支持人员执行此操作。

改变骑行时间：

 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.     
      }
    ...............
 });

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

1 个答案: