猫头鹰旋转木马slideSpeed不工作

我在我的主页上设置了多个猫头鹰旋转木马。我有第一个（关于免费送货的）设置为10000的slideSpeed。正如你可以看到所有的幻灯片以相同的速度改变。猫头鹰旋转木马slideSpeed不工作

有没有原因，这不起作用？难道我做错了什么？

来源

2014-10-18 danjfoley

自动播放是设置幻灯片更改速度的地方。不slidespeed

来源

2014-10-19 13:10:53 danjfoley

这救了我天。谢谢。 – Nilambar 2015-01-06 03:49:41

请注意，你必须使用

autoplay:true, 
    autoplayTimeout:5000

使用owlCarousel 2.0

来源

2015-11-10 09:50:10 neoMagic

-2

更改任何integrer例如将autoPlay时：5000至每5秒播放。如果你设置了autoPlay：true默认速度将是5秒。

Змінітьзначенняналюбецілечисло，наприклад将autoPlay：10000，паузаавтозмінюванняскладатиме10секунд。 Якщовстановитизначення“true”，швидкістьавтоанімаціїстановитиме5секунд。

来源

2016-07-18 17:18:18 Mister

请在评论中使用英文，这样每个人都可以受益。 – 2017-02-28 00:08:18

您好我现在用猫头鹰旋转木马公测2.0.0 我发现一个选项来延迟对于滑动速度编辑选项“smartSpeed：毫秒”

尝试如下图

来源

2016-08-16 04:05:14 Thet

请将您的代码作为文本发布，而不是图片。 – 2016-08-16 04:31:30

注意：此回复适用于猫头鹰传送带2，并且淡出转换的速度仅为。如果您的传送带滑动而不是褪色，请忽略此答案。这不是对原始问题的直接回答，但希望有助于更全面地了解如何控制OwlCarousel 2中的幻灯片转换速度。正如我从Google获得的，试图找出如何控制淡入淡出速度，我希望您能容忍它的存在可能对其他人有用。

我无处尝试使用smartSpeed或任何其他选项，设置淡入淡出的过渡期限，但看了他们用animate.css我猜重写CSS3过渡的速度是取胜的关键，所以我甩下面放到滑块前面的页面上并工作。

<style type="text/css"> 
.my-parent-class .owl-carousel .owl-item { 
    -webkit-animation-duration: 3s !important; 
    animation-duration: 3s !important; 
} 
</style>

这并不影响滑动速度，只是淡化速度。如果你有一个滑动滑块，这不是你的答案。

在我$(".owl-carousel").owlCarousel({})功能我设置自动播放如下：

autoplay: true, 
autoplayTimeout: 5000,

3S的CSS3过渡期与5000毫秒autoplayTimeout合并意味着结束的转变，并且下一个起点之间2秒时 - 如果你想在幻灯片等在下一次转换之前5秒，您需要将css转换时间添加到autoplayTimeout，例如在这个例子中，autoplayTimeout：8000。

来源

2016-09-22 09:34:15 Jon

谢谢。这帮助了我。我应该注意的一件事是，我的内容是'owl-item'，它被设置为'position：absolute'，'z-index'为'1'。这导致了定位的内容马上弹出而不会褪色。我删除了'z-index'并完全解决了我的问题。 – Gavin 2017-01-17 02:41:09

要改变在该滑块滑动你需要应用这个速度...

<style type="text/css"> 
.owl-stage { 
transition: 0.8s !important; 
} 
</style>

...这会减慢转变。

来源

2017-01-16 10:36:26 alib0ng0

这可行，但如果旋转木马有stagePadding然后项目图像出现故障移动 – 2018-02-17 23:59:09

刚刚成立时间将autoPlay选项

$("#slider").owlCarousel({ 
    autoPlay: 2500, 
    //autoPlay: true, <-- if you want to set default slide time (5000) 

    slideSpeed: 300, 
    paginationSpeed: 500, 
    singleItem: true, 
    navigation: true, 
    scrollPerPage: true 
});

来源

2017-04-26 16:34:14

变革滑动速度测试验证码：（autoplayTimeout属性可以设定下滑的持续时间）

    jQuery(document).ready(function ($) { 

         var ocClients = $("#Slider"); 

         ocClients.owlCarousel({ 
          loop: true, 
          nav: false, 
          autoplay: true, 
          autoplayTimeout: 2000, 
          dots: false, 
          autoplayHoverPause: false, 
          responsive: { 
           0: { 
            items: 1 
           }, 
           480: { 
            items: 3 
           }, 
           768: { 
            items: 4 
           }, 
           992: { 
            items: 5 
           }, 
           1200: { 
            items: 7 
           } 
          } 
         }); 

        });

来源

2017-09-14 05:48:10

jQuery('.owl-carousel').owlCarousel({ 

    loop:true, 

    margin:10, 

    dots: true, 

    autoplay: 3000, // time for slides changes 

    smartSpeed: 1000, // duration of change of 1 slide 

    responsiveClass:true, 

    responsive:{ 

     0:{ 

      items:1 

     }, 

     600:{ 

      items:1 

     }, 

     1000:{ 

      items:1, 

      loop:true 

     } 

    } 

});

来源

2017-11-20 12:13:53

请添加您的解决方案，而不是只是代码的要点。 – pirho 2017-11-20 12:35:01

猫头鹰旋转木马slideSpeed不工作

回答

相关问题