Javascript 猫头鹰转盘不工作，可能是我链接错误？

我试图在我的新项目中使用猫头鹰转盘。我似乎对此有意见。到目前为止，只有HTML和CSS在工作。我不知怎么把剧本弄错了。有没有人能帮我一把，看看我把事情搞砸的方向

这里是该网站的链接。猫头鹰转盘靠近网站底部。您将看到两个“合作伙伴”部分。顶部只是演示HTML，底部是我试图用来创建旋转木马的内容。我只是暂时使用虚拟图像

这是我获取代码的网站

下面是一些代码片段。如果你需要任何进一步的细节，我会尽力提供

$（文档）.ready（函数（）{
$（“#猫头鹰演示”）.owlCarousel({
自动播放：3000，//将自动播放设置为3秒
项目：4，
itemsDesktop:[1199,3]，
itemsDesktopSmall:[979,3]
});

.grayscale{
边框：0px纯黑；
滤镜：灰度（100%）；
-webkit过滤器：灰度（100%）；
/*适用于Webkit浏览器*/
过滤器：灰色；
/*对于IE 6-9*/
-webkit过渡：所有.6s轻松；
/*Webkit浏览器的转换*/
}
.灰度：悬停{
滤镜：灰度（0%）；
-webkit过滤器：灰度（0%）；
过滤器：无；
}
#猫头鹰演示{
保证金：3倍；
}
#猫头鹰演示。猫头鹰项目img{
显示：块；
宽度：100%；
高度：自动；
}

$（文档）.ready（函数（）{
$（“#猫头鹰演示”）.owlCarousel({
自动播放：3000，//将自动播放设置为3秒
项目：4，
itemsDesktop:[1199,3]，
itemsDesktopSmall:[979,3]
});

好的，我已经修复了代码片段

我修复的东西：

• 添加了jquery脚本
• 在jquery之后添加了owlcarousel脚本和css
• 正确关闭JS括号

建议:

使用浏览器的控制台。f12应该打开它，然后很容易找到错误

您的代码很少“正常工作”，您需要知道如何调试它（这在web开发中非常容易）

$（文档）.ready（函数（）{
$（“#猫头鹰演示”）.owlCarousel({
自动播放：3000，//将自动播放设置为3秒
项目：4，
itemsDesktop:[1199,3]，
itemsDesktopSmall:[979,3]
});
})；//请注意，需要两组收尾括号！一组用于.ready，另一组用于carousel。

.grayscale{
边框：0px纯黑；
滤镜：灰度（100%）；
-webkit过滤器：灰度（100%）；
/*适用于Webkit浏览器*/
过滤器：灰色；
/*对于IE 6-9*/
-webkit过渡：所有.6s轻松；
/*Webkit浏览器的转换*/
}
.灰度：悬停{
滤镜：灰度（0%）；
-webkit过滤器：灰度（0%）；
过滤器：无；
}
#猫头鹰演示{
保证金：3倍；
}
#猫头鹰演示。猫头鹰项目img{
显示：块；
宽度：100%；
高度：自动；
}

---

此外，如果您计划根据您可以使用的响应屏幕大小限制项目数量

        responsive : {
            480 : { items : 4  }, // from zero to 480 screen width 4 items
            768 : { items : 6  }, // from 480 screen widthto 768 6 items
            1024 : { items : 8   // from 768 screen width to 1024 8 items
            }
        },

---

问题是您需要将“item”指定为1以响应工作

这是工作代码

$(".owl-carousel").owlCarousel({
      autoPlay: 3000,
      items : 1, // THIS IS IMPORTANT
      responsive : {
            480 : { items : 1  }, // from zero to 480 screen width 4 items
            768 : { items : 2  }, // from 480 screen widthto 768 6 items
            1024 : { items : 3   // from 768 screen width to 1024 8 items
            }
        },
  });

---

当您使用jQuery3时，请更改OWLCarouselJS

---

通过将Owlcarousel代码中的“andSelf”更改为“addBack”进行修复。

您没有关闭堆栈片段中的document.ready函数。添加

}）；

就在

之前，我不确定您的意思。我就在那里看到了。items:4，itemsDesktop:[1199,3]，itemsDesktopSmall:[979,3]}）；实际上，在顶部的JS部分中，删除脚本标记。在底部的html部分中，删除脚本标记以及它们之间的所有内容。您当前有两次JS代码。我的javascript和css是通过functions.php文件提取的。有人告诉我，这是避免发生错误的正确方法。我编辑了我的原始问题并将其添加到上面。我猜这就是我需要修复脚本的地方了？@Tyrii拉JS和CSS的正确方法是：

。我不明白这与问题或答案有什么关系。@Tyrii您需要解决的第一个问题是，您试图在不加载jquery的情况下使用jquery。您可以通过两种方式加载它：从计算机上的本地副本或通过cdn。我的答案显示了cdn方法，我还将添加另一种方法。我将使用cdn进行拉取。：）你的方法行得通，所以我不会抱怨。非常感谢你这么多的SlicedLoad。至少就猫头鹰转盘2而言，这不再是事实。目前，没有提及“项目”属性。此外，响应对象现在从0开始，而不是从480开始（或者不管第一个断点是什么）。