按左右箭头更改图库中的图像？答案

【问题标题】：Press left and right arrow to change image in gallery?按左右箭头更改图库中的图像？
【发布时间】：2015-11-23 15:31:23
【问题描述】：

我的页面上有画廊，我想添加对左/右箭头的支持，以便在幻灯片之间切换。模板使用Galleria Folio Theme。

链接在这里：http://url.kybernaut.cz/19

导航代码如下：

<div class="galleria-image-nav">
  <div class="galleria-image-nav-right" style="right: -50px; transition: none;"></div>
  <div class="galleria-image-nav-left" style="left: -50px; transition: none;"></div>
</div>

我在这里得到了启发 Press left and right arrow to change image? 但它似乎根本不起作用，代码：

jQuery(document).keypress(function (e){ 
    if(e.keyCode == 37) // left arrow
    {
        // your action here, for example
        jQuery('.galleria-image-nav-left').click();
    }
    else if(e.keyCode == 39)    // right arrow
    { 
        // your action here, for example
        jQuery('.galleria-image-nav-right').click();
    }

有人可以帮帮我吗？它是一个 wordpress 模板（因此是非冲突模式），并且脚本已正确加载，但无法正常工作。非常感谢您的帮助。

【问题讨论】：

标签： jquery

【解决方案1】：

您应该能够使用 Galleria API：

Galleria.ready(function() {
    this.attachKeyboard({
        right: this.next,
        left: this.prev
    });
});

Support Reference

API Docs

【讨论】：

酷。谢谢，但我应该把它放在哪里？我已将它添加到我的 custom.js 中，但它写到我的“Galleria 未定义”。
@kybernaut.cz 需要在 Galleria 对象初始化后运行。我希望将它放在 jQuery(document).ready 块中可以解决问题，否则在 Galleria 脚本之后加载脚本。
我认为它已经完成但仍然无法正常工作......这是functions.js，它可能应该在某个地方初始化，但我无法找到它:(pastebin.com/nx9ehPJr

【解决方案2】：

我在下载 Galleria 1.6.1 时遇到了同样的问题。如果未显示导航图像，则可能是 galleria.folio.css 文件的 url 调用格式不正确。例如：url(left.png) 应该格式化为 url('left.png')。在所有图像文件名周围加上单引号应该可以解决问题。似乎 Galleria 1.6.1 的某些来源通过在 css 中嵌入图像而不是链接到文件来纠正此问题。

另外，请确保包含类似于

的行

在 html 文件的

语句中正确加载 folio css 文件。

【讨论】：