问题标签 [owl-carousel]

基本上，我使用 :before sudo 元素（SASS）为带有附加图标的按钮设置样式

这创建了我的按钮，一切都非常完美。

挑战在于使用 OwlCarousel 时。我在每个列出的轮播中都有一个按钮，它仍然显示在桌面上，但不能在移动设备上显示。

Onload 它使用字体图标呈现第一组按钮，但是当滑动到下一个轮播时，它显示按钮，但字体图标在幻灯片完成时消失。每次我通过滑动或单击下一个箭头更改活动轮播时，按钮箭头都会闪烁。

我用谷歌搜索了互联网，没有发现任何人有同样的问题。

我已经在Android（Nexus 4）和iPhone（5s）上对此进行了测试，我认为这是一个渲染问题，但我不知道该怎么想或如何解决这个问题。

任何帮助都可以。

我有一个猫头鹰旋转木马，每张幻灯片有一个项目，画廊中的每张图片都有不同的尺寸和纵横比。

我想要的是获取当前或活动图像的宽度和高度。

我试过了：

但是，这会返回图像之前的尺寸，而不是它更改为的图像。

我正在制作一个练习网站，但我之前从未制作过图像轮播，所以我决定试试运气。经过一番谷歌搜索，我找到了 Owl Carousel，它似乎是一个非常有用的制作旋转木马的工具。但是，在安装它时，我根本无法理解说明。

这是我到目前为止所做的：

1. 我下载了 Owl Carousel 并将“assets”和“owl-carousel”文件夹移动到我的根目录中。

2. 我将所有这些都包含在我的 head 标签中：

   /li>

3. 我像这样设置我的HTML：

   /li>

4. 我将此添加到我的 CSS 中：

   /li>

5. 最后，我激活了这个脚本。

   /li>

我正在努力实现这个结果：

http://owlgraphic.com/owlcarousel/demos/one.html

这是我在 Jfiddle 上的所有代码。

http://jsfiddle.net/pd19q8vc/

这根本不是我的网站的外观，但我只是希望在需要时可以使用全部代码。

那么我做错了什么？我怎样才能让这个旋转木马工作？

我正在创建一个站点，其中使用 Ajax 将内容动态加载到 OwlCarousel 项目中，这些项目是使用 addItem() 方法根据需要创建的。

从http://owlgraphic.com/owlcarousel/demos/manipulations.html的演示中可以看出，当调用 addItem 时，轮播总是跳回第一个项目（即最左边，或第一个'页面'）。我希望它自动滚动到新创建的项目（即最右边或最后一个“页面”，以显示新创建的项目）。有没有办法修改代码来实现这一点？似乎只要调用 addItem() ，轮播就会跳跃。

我有一个猫头鹰轮播的问题，我在 HTML 文件中添加了这段代码：

但导航器向我显示一列中的数字，没有格式。我将所有猫头鹰轮播放在正确的文件夹中。哪个是问题？

导航器是谷歌浏览器，是最后一个版本。

感谢所有回复

I am using the Owl Carousel and Picturefill plugins and I would like to lazy load the main slider images. Any help would be appreciated. In the example url, click on the "Responsive" thumbnail (second image after the YouTube thumbnail). Then expand/contract your browser window and you should see the image referenced being updated depending on the size of the browser.

Example url:

http://dx1showroom.azurewebsites.net/picturefill/2.html

Goals:

• Use Owl Carousel - www.owlcarousel.owlgraphic.com
• With Picturefill - http://scottjehl.github.io/picturefill/
• Sync with second owl carousel slider
• And lazy load main slider

I have working:

• Owl carousels are working
• Synced carousels (main & thumbnail sliders)
• Loading images with Picturefill

HTML:

JavaScript:

我目前正在使用 Owl Carousel 插件按照下面地址中显示的演示创建多个同步的轮播，尽管在一页上有多个轮播。

http://owlgraphic.com/owlcarousel/demos/sync.html

在处理不同数量的小物品时，我已经成功地复制了轮播，并让它们除了一个特定的问题之外独立工作。当我在顶部轮播中创建的项目多于底部并在底部轮播显示的项目之外选择一个小项目时，两个小项目轮播都会移动以显示该项目（在顶部未选择）

也就是说，用下面的代码，从顶部轮播中选择“20”，然后观看底部轮播的小物品轮播右移显示20项。然后在顶部小物品轮播中选择项目3，观看底部小物品旋转木马再次向后移动。奇怪的是，当底部轮播的 jQuery 参数中的项目数量增加时，它根本不会影响顶部的项目。

我确定这是一个需要为其分配不同名称的变量的情况，但我无法终生找出问题所在。有什么想法吗？

使用Owl Carousel我想使用图像alt="Image Alt Text"或title="Image Title Text"图像中的文本作为分页而不是项目符号/圆圈。在写问题和小提琴的过程中，我怀疑它。见下文。希望这对其他人有用。

演示小提琴

加载页面时，我需要将类更改为当前项目。我在当前项目中显示标题。这是代码：

这是一个工作示例：http: //jsfiddle.net/kurtko/1qdurrLz/16/

此代码在轮播更改时工作正常，但在加载页面时失败，因为 e.relatedTarget.current() 为空

有任何想法吗？

谢谢。

我想将猫头鹰轮播添加到我的网页，但它没有加载，浏览器控制台中也没有错误消息。为什么轮播不加载？