wordpress 中的 Galleria 插件在 ie 或 chrome 中不起作用

Question

我昨天和今天大部分时间都在寻找解决方案，但没有找到任何解决方案。我正在为客户创建一个文字新闻网站。我使用 Galleria 作为主页滑块。我没有使用 wordpress 插件版本，而是使用可从网站下载的 jQuery 版本。

从视觉上看，它在 FF 和移动设备中运行良好。然而，在 FF 错误控制台中，它说 scriptaulous 需要原型 1.6 或更高版本。在 Chrome 中，无论是否有效，它都是 50/50 的镜头，而在 IE 9 和 IE 10 中，它似乎要么在舞台的左上角制作一个小图像，要么在右下角截断一个大图像，是的，仍然有过渡。我还收到消息说它不会加载到其他机器上。

我尝试链接到prototype.js 文件以及添加jQuery.noConflict() 但没有成功。

我还尝试编辑将 Galleria 初始化为 jQuery 而不是 $ 和其他一些变体的代码。下面是网站和sn-p的代码。

www.penandpixelmedia.com/Zareh

      <script>
      Galleria.loadTheme('galleria/themes/classic/galleria.classic.min.js');
        $("div.slide").galleria({
           width:1400,
            height:620,
            transition: 'fade',
            showInfo: false,
            autoplay: 4000,
            lightbox:true,
            showImagenav:false,
            imageCrop:'landscape',
           thumbnails:false
        });

        </script>

任何解决方案将不胜感激。

Answer 1

在控制台中我收到以下错误：

Uncaught TypeError: Object [object Object] has no method 'galleria'

这个错误让我相信您错误地初始化了 Galleria 插件。在您的代码中，您使用以下内容：

$("div.slide").galleria();

我跳转到他们的网站并查看了他们的documentation。他们似乎建议您执行以下操作来初始化 Galleria。

Galleria.run('#galleria'); 或者在你的情况下是Galleria.run('div.slide');

另外，我注意到您的网站上包含了三个独立的 JavaScript 库/框架（Prototype、Scriptaculous 和 jQuery）。这可能会导致库之间出现一些问题/冲突。

此外，您可以在初始化此插件时单独指定选项。这是初始化插件并根据需要进行配置所需的代码：

var jQ = jQuery.noConflict();
jQ(function(){
    Galleria.loadTheme('galleria/themes/classic/galleria.classic.min.js');
    Galleria.run('div.slide');
    Galleria.configure({
        width:1400,
        height:620,
        transition: 'fade',
        showInfo: false,
        autoplay: 4000,
        lightbox:true,
        showImagenav:false,
        imageCrop:'landscape',
        thumbnails:false
    });
});