jquery 在 fancybox 处于活动状态时停止/暂停 jcarousel 播放

发布于 2025-01-06 16:56:42 字数 1079 浏览 5 评论 0原文

我默认播放 jcarousel(下面复制了就绪函数)。我在同一页面上还有一个缩略图链接,可打开 fancyzoom 覆盖 div (#flash_box)包含视频。我想在 fancyzoom 覆盖处于活动状态时停止/暂停 jcarousel。我确信这是可能的,但我仍然在努力了解控制像这样的 jquery 元素的基础知识。非常感谢任何帮助。

// Ride the carousel...
jQuery(document).ready(function() {
    jQuery("#mycarousel").jcarousel({
        scroll: 1,
        auto: 4, // delay between image slide
        wrap: 'last',
        initCallback: mycarousel_initCallback,
        // This tells jCarousel NOT to autobuild prev/next buttons
        buttonNextHTML: null,
        buttonPrevHTML: null,
        itemVisibleInCallback: {
            onAfterAnimation: function(c, o, i, s) {
            --i;
              jQuery('.jcarousel-control a').removeClass('active');
              jQuery('.jcarousel-control a:eq('+i+')').addClass('active');
            }
          }

    });
});

    $(document).ready(function() {
        $('div.photo a').fancyZoom({scaleImg: true, closeOnClick: true});
        $('#flash_box_link2').fancyZoom();

    });

I have a jcarousel playing by default (ready function copied below). I also have a thumbnail image link on the same page which opens a fancyzoom overlay div (#flash_box) containing a video. I would like to stop/pause the jcarousel whilst the fancyzoom overlay is active. I'm sure this is possible, but I'm still struggling to get the fundamentals of controlling jquery elements like this. Any help much appreciated.

// Ride the carousel...
jQuery(document).ready(function() {
    jQuery("#mycarousel").jcarousel({
        scroll: 1,
        auto: 4, // delay between image slide
        wrap: 'last',
        initCallback: mycarousel_initCallback,
        // This tells jCarousel NOT to autobuild prev/next buttons
        buttonNextHTML: null,
        buttonPrevHTML: null,
        itemVisibleInCallback: {
            onAfterAnimation: function(c, o, i, s) {
            --i;
              jQuery('.jcarousel-control a').removeClass('active');
              jQuery('.jcarousel-control a:eq('+i+')').addClass('active');
            }
          }

    });
});

    $(document).ready(function() {
        $('div.photo a').fancyZoom({scaleImg: true, closeOnClick: true});
        $('#flash_box_link2').fancyZoom();

    });

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

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

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。
列表为空,暂无数据
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文