jCarousel - 如何通过自动滚动在悬停时暂停?

发布于 2024-12-27 05:23:06 字数 439 浏览 4 评论 0原文

JCarousel 最近发生了变化(2011 年 1 月)。
它曾经有一种方法可以通过自动滚动实现悬停暂停。

在新版本中,我无法解决如何让自动滚动在悬停时停止:
我希望滚动在鼠标悬停时停止并在鼠标移出时重新开始。
有什么建议吗?

示例代码在这里 - http://testsite3.dk/jcarousel/
Jcarousel 在这里:github.com/jsor/jcarousel

链接到 JQuery + javascript 以在此处加载拇指 - http://testsite3.dk /jcarousel/autoscroll.txt

JCarousel have recently changed (january 2011).
It used to have a way to implement pause on hover with autoscroll.

With the new version I cannot solve how to get autoscroll to stop on hover:
I would like the scroll to stop on mouseover and start again on mouseout.
Any suggestions?

Example code is here - http://testsite3.dk/jcarousel/
Jcarousel here: github.com/jsor/jcarousel

Link to JQuery + javascript to load thumbs here - http://testsite3.dk/jcarousel/autoscroll.txt

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

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

发布评论

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

评论(4

生生漫 2025-01-03 05:23:06

将此代码添加到您的 jcarousel initCallback(carousel) 中

 carousel.clip.hover(function() {
    carousel.stopAuto();
}, function() {
    carousel.startAuto();
}); 

add this code into your jcarousel initCallback(carousel)

 carousel.clip.hover(function() {
    carousel.stopAuto();
}, function() {
    carousel.startAuto();
}); 
雨后咖啡店 2025-01-03 05:23:06

我无法让前面的例子工作。但我确实得到了以下内容来与最新的 jcarousel 一起使用。

$('.carousel').jcarouselAutoscroll(
{
    interval: 4000, 
    scroll: '+=1',
    create: $('.carousel').hover(function() 
    {
        $(this).jcarouselAutoscroll('stop');
    },
    function() 
    {
        $(this).jcarouselAutoscroll('start');
    });
});

I couldn't get the previous examples working. But I did get the following to work with the latest jcarousel.

$('.carousel').jcarouselAutoscroll(
{
    interval: 4000, 
    scroll: '+=1',
    create: $('.carousel').hover(function() 
    {
        $(this).jcarouselAutoscroll('stop');
    },
    function() 
    {
        $(this).jcarouselAutoscroll('start');
    });
});
梦初启 2025-01-03 05:23:06

更新答案以保持最新状态。

请参阅 https://github.com/jsor/jcarousel/issues/568 了解正确的回答:

$('.jcarousel').hover(function() {
    $(this).jcarouselAutoscroll('stop');
}, function() {
    $(this).jcarouselAutoscroll('start');
});

Updating the answer to stay current.

See https://github.com/jsor/jcarousel/issues/568 for the correct answer:

$('.jcarousel').hover(function() {
    $(this).jcarouselAutoscroll('stop');
}, function() {
    $(this).jcarouselAutoscroll('start');
});
没有心的人 2025-01-03 05:23:06

您可以在创建回调中绑定自己的悬停事件:

  .jcarouselAutoscroll({
    autostart: true,
    interval: 1000,
    scroll: '+=3',
    create: $('#thumbs').bind('mouseenter', function () {
                $(this).jcarouselAutoscroll('option', 'scroll', '+=0' );
            }).bind('mouseleave', function () {
                $(this).jcarouselAutoscroll('option', 'scroll', '+=3' );
            })

  });

You can bind your own hover events in the create callback:

  .jcarouselAutoscroll({
    autostart: true,
    interval: 1000,
    scroll: '+=3',
    create: $('#thumbs').bind('mouseenter', function () {
                $(this).jcarouselAutoscroll('option', 'scroll', '+=0' );
            }).bind('mouseleave', function () {
                $(this).jcarouselAutoscroll('option', 'scroll', '+=3' );
            })

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