Jcarousel - 在无限循环中首先显示最后一张图像

发布于 2024-12-02 16:47:44 字数 1165 浏览 0 评论 0 原文

我想知道使用 Jcarousel 的人是否会对如何克隆或显示轮播的最后一个图像作为第一个图像有建议。

5 张照片的示例,其中轮播显示 3 张图像,目前看起来像这样:

1 - 2 - 3 (4 和 5 正在等待显示)

相反,这是我在加载时试图实现的目标:

5 - 1 - 2 ( 3和4正在等待显示)

我现在使用的是以下设置:

wrap: 'circular', 滚动:1, auto: 1,

我尝试了 offset: -1 但这显示空白并且不起作用。

我还尝试过使用偏移量来启动最后一张图像的轮播 - 但是,将换行设置为“圆形”时,这也不起作用,并使其他图像变为空白,直到您手动加载它们。

我已尽力自行寻找答案,但感谢您的帮助,提前致谢。

编辑:我也愿意接受可以做到这一点的不同脚本的建议 - 谢谢!

编辑#2:首先感谢您的评论。进一步研究:我发现这个网站(www.anothermag.com)在首先显示最后一张图像方面做得很好,我相信它是基于代码使用 Jquery SerialScroll 的。我还没有尝试过,但看起来确实很有希望。我的另一个想法是看看是否可以使最后一个图像显示为 WordPress 循环中的第一个图像,以便它仍然使用 Jcarousel 但对最后一个图像进行硬编码。将发布更多更新。

编辑#3:最终解决方案:

我选择了 Sparky672 的以下答案,因为我认为可以肯定地说,截至今天,Jcarousel 无法在加载之前不干预重新排列图像的情况下执行此操作。

然而,如果有人对选项/替代方案感兴趣,我将使用 Fred HQ 的优秀脚本“Roundabout”。我将使用的示例在这里: http://frdhq.com/projects/roundabout/demo/通过

一些小的修改,它将完全满足我的需要,而无需在加载部分进行太多工作。

设置是将所有图像的不透明度设置为 1,将倾斜设置为 0,在设置的间隔内添加自动滚动,将框的大小设置为相同的大小。

这个特殊的轮播需要一个白色的分隔线,所以我将使用“在事物周围移动事物”示例,使中间的“事物”成为一个白色框,以隐藏后面循环的内容。

我希望这对某人有帮助。

再次感谢!

I'm wondering if anyone using Jcarousel would have a suggestion on how to clone or display the very last image of the carousel as the first image.

Example of 5 photos where the carousel shows 3 images it currently looks like this:

1 - 2 - 3 (4 and 5 are waiting to be shown)

Instead, here is what I am trying to achieve on load:

5 - 1 - 2 (3 and 4 are waiting to be shown)

What I am using at the moment is the following settings:

wrap: 'circular',
scroll: 1,
auto: 1,

I have tried an offset: -1 but this shows a blank and does not work.

I have also tried an offset to start the carousel with the last image - however, with wrap set to 'circular' this also does not work and makes other images blank until you manually load them.

I have done my best to look for an answer on my own but would appreciate your help, thanks in advance.

EDIT: I'm also open to suggestions of a different script that can do this - thanks!

EDIT #2: Thank you first of all to those commenting. Further research: I have found this site (www.anothermag.com) does a fine job of showing the last image first which I believe is using Jquery SerialScroll based on the code. I have yet to try this but does seem very promising. Another idea I have is to see if I can make the last image show as the first in the Wordpress Loop so that it still uses Jcarousel but hardcodes the last image. Will post more updates.

EDIT #3: final solution:

I have chosen the answer below by Sparky672 since I think it's safe to say Jcarousel as of today is not capable of doing this without intervening with rearranging images before it loads.

However, in case anyone is interested in an option/alternative, I will be using Fred HQ's excellent script "Roundabout". The example I will be using is here: http://fredhq.com/projects/roundabout/demo/around

With a few small modifications, it will do exactly what I need without much work in the loading part.

The settings would be to set opacity to 1 for all images, set tilt to 0, add auto-scroll in set interval, set size of the boxes to same size.

This particular carousel requires a white divider so I will be using the "Moving things around things" example to make the "thing" in the middle a white box to hide what is being looped behind.

I hope this helps someone.

Thanks again!

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

π浅易 2024-12-09 16:47:44

您看到这些空白图像是因为您使用了损坏的选项。 jCarousel 是一个很棒的脚本,但即使是开发人员也承认 wrap:circular 演示显示了循环换行问题(取决于浏览器)。几个月来,他一直谈论修复这个问题。我仍然使用该插件,但我只是不使用 wrap:circular 选项。

编辑:我也愿意接受不同脚本的建议
这 - 谢谢!

您可以尝试 jCarousel Lite 作为替代方案。当我想要圆形包装时,我使用了 jCarousel Lite。

You're seeing these blank images because you're using a broken option. jCarousel is a great script but even the developer acknowledges that wrap:circular is not working. The developer's own demo shows the circular wrap issue (depends on the browser). He's been talking about fixing it for several months now. I still use the plugin but I just don't use wrap:circular option.

EDIT: I'm also open to suggestions of a different script that can do
this - thanks!

You can try jCarousel Lite as an alternative. I've used jCarousel Lite when I wanted a circular wrap.

我也只是我 2024-12-09 16:47:44

jCarousel Lite 无法立即执行您想要的操作。

为了使幻灯片具有 3 个可见的圆形图像,它会克隆前 3 个和最后 3 个图像。请参阅默认配置演示: http://www.gmarwaha.com/jquery/jcarousellite/#demo< /a>

这意味着您需要在启动插件之前修改图像的顺序。

jCarousel Lite cannot do what you want out of the box.

To make a slideshow with 3 images visible circular, it clones the first 3 and the last 3 images. See default config demo: http://www.gmarwaha.com/jquery/jcarousellite/#demo

This means you'll need to modify the order of the images before you initiate the plugin.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文