Question

在网页的标题中放置一个显示幻灯片的横幅。可以找到一个示例here。现在，当用户在包含照片库的页面上并且他点击缩略图时，灯箱将打开（shadowbox.js）。在打开灯箱的同时，应停止幻灯片演示脚本，以免用户分心。

概括为：正常：正在执行幻灯片显示的脚本 当用户点击缩略图（使用某个rel attr“shadowbox”）时：应该阻止幻灯片放映脚本。 当灯箱关闭时（使用Shadowbox的onClose挂钩？）应重新初始化标题中幻灯片放映的脚本。

有关于此的任何想法吗？

Answer 1

您使用的Shadowbox版本为 v3.0.3 ，即当前的稳定版本。

您使用的其他插件的名称为Durpal Rotating Banner v6，但版本 7.2 可供使用。

使用 Shadowbox Hook选项，.onOpen();和onClose();与旋转横幅脚本进行交互时，您完全正确无误。但是，除了通过自定义菜单配置选项外，旋转横幅脚本没有API使用文档。

检查记录良好的JavaScript可下载压缩文件，显示如何与 Durpal旋转横幅进行交互，无论您使用何种版本。

首先，我不使用Shadowbox的插件版本，只使用Shadowbox网站上的独立版本，但是这个方法应该为那些着陆的各种Shadowbox插件（例如，Drupal，WordPress）说出来在这个答案上。

如果您无法访问Shadowbox.init({});，请在网页的结束正文标记之前使用此脚本，否则跳转到下一个代码块：

  <script type="text/javascript">

     window.onload=function(){

        Shadowbox.setup('',{

            // Besides 'pause' and 'resume' are 'prev', 'next', and 'stop' found in the jQuery Cycle Plugin (check inside jQuery Easing Plugin to see if it's combined).

              onOpen: function(){
                  jQuery('.rb-slides').each(function () {
                    if (jQuery(this).cycle) {
                      jQuery(this).cycle('pause');
                    }
                  });
              },
              onClose: function(){
                  jQuery('.rb-slides').each(function () {
                    if (jQuery(this).cycle) {
                      jQuery(this).cycle('resume');
                    }
                  });
              }

            // If you have access to Shadowbox.init({}), then place the above onOpen and onClose in there instead of using this script.

        });

     };

   </script>

如果您可以通过Shadowbox.init({});访问Shadowbox初始化，请使用下面的onOpen();和onClose();部分，如图所示。

  <script type="text/javascript">

       Shadowbox.init({

           onOpen: function(){
               jQuery('.rb-slides').each(function () {
                 if (jQuery(this).cycle) {
                   jQuery(this).cycle('pause');
                 }
               });
           },
           onClose: function(){
               jQuery('.rb-slides').each(function () {
                 if (jQuery(this).cycle) {
                   jQuery(this).cycle('resume');
                 }
               });
           }

       });

   </script>

在我的测试环境中，这适用于带有Base或jQuery Adapter接口的Shadowbox ......对我来说这是一个下载选项（除了jQuery库）。

当Shadowbox打开时，上面的脚本会暂停网页上找到的所有旋转横幅，然后在Shadowbox关闭时重新启动它们。

如何在Shadowbox打开和关闭时暂停/播放Drupal旋转横幅？

1 个答案: