Question

到目前为止，我很喜欢Reveal.js。但是，我遇到的一个问题是，我的无线演示遥控器通常只能生成左/右箭头键击。我的Reveal.js幻灯片大量使用它的二维功能以及碎片。这意味着我的遥控器只向右移动，而不是向下移动。

Reveal.js API看起来应该足够强大，可以连接一些内容，以便“右箭头”在可能的情况下首先向前推进，然后是正确的，将片段考虑在内。不幸的是我的JS-fu并不那么强大，所以我想我会问其他人之前是否曾做过类似的事情并且有一些指示。如果还有其他方法可以更好地发挥作用，我也会对此持开放态度。我只是不想被绑在键盘上。

Answer 1

你想要的是它会导航到“next”而不是“right”，这是右箭头键的默认绑定。您可以通过覆盖默认键绑定来实现此目的。这里有一些文档：https://github.com/hakimel/reveal.js/#keyboard-bindings

在您的情况下，您希望右箭头键（键代码39）绑定到“next”，并且可能还会覆盖左箭头键（键代码37）以绑定到“prev”。下面是示例代码（将此添加到Reveal.initialize配置中添加文件的结尾）：

keyboard: {
    39: 'next',
    37: 'prev'
}

Answer 2

reveal.js有一个内置遥控器！如果您查看自述文件中的dependencies，Reveal.initialize中的最后一项是激活遥控器的选项！它会弹出一个你可以扫描的二维码;它会让您与您的演示文稿同步（通过互联网，而不是本地wifi /蓝牙），并允许您使用触摸屏设备控制您的演示文稿。甚至有一个应用程序（适用于iOS）专门用于使用遥控器，我相信它被称为RemotesLite。

使用遥控器时，水龙头相当于空格键，向左/向右/向上/向下向左/向右/向上/向下滑动，向内/向外进行捏合是概览模式激活/停用。

希望这有帮助！

更新2014年4月21日

似乎最新版本的Reveal具有内置的演示者远程支持。最近用Targus演示文稿进行了远程演示，它开箱即用！

Answer 3

这对我有用。

Reveal.configure({
    keyboard: {
        38: 'next',
        40: 'prev'
    }
});

Answer 4

我必须确保以正确的顺序设置幻灯片，但我的Logitech R800会完成所有片段并正确排序（如果幻灯片下面有子内容，请点击下一步再往右走。）

Answer 5

建议的解决方案仅部分解决了问题。它们重新映射向上和向下箭头键，或者重新映射向左和向右箭头键。如果您不知道演示者远程发出哪些密钥，只需重新映射所有密钥：

// Either Reveal.initialize({ ... or
Reveal.configure({
    keyboard: {
        37: 'prev',
        38: 'prev',
        39: 'next',
        40: 'next'
    }
})

切换到概览模式时（使用o），您仍然可以使用vim键绑定h，j，k和{{1}进行导航左，上，下，右。

使用此配置，您可以确保每个演示者远程工作。

Answer 6

我已经实现了更高级的“演示者模式”（请参见cloudogu/continuous-delivery-slides）。

您可以使用,进行切换。它甚至可以在重新加载页面后幸免。
如果您希望重新加载后关闭演示者模式，请参见this commit。

Reveal.initialize({
    keyboard: {
        188: () => setPresenterMode(true)
    }
});

setPresenterMode(false);

function setPresenterMode(toggle) {
    const storage = localStorage;
    const storageKey = 'presenterMode';
    if (toggle) {
        storage.setItem(storageKey, JSON.stringify(!JSON.parse(storage.getItem(storageKey))));
    }
    const presenterMode = JSON.parse(storage.getItem(storageKey));
    if (presenterMode) {
        Reveal.addKeyBinding({keyCode: 39}, 'next');
        Reveal.addKeyBinding({keyCode: 37}, 'prev');
    } else {
        Reveal.removeKeyBinding(37);
        Reveal.removeKeyBinding(39);
    }
    console.log(`Set presenter mode: ${storage.getItem(storageKey)}`);
}

Answer 7

Reveal 3.8.0 添加了一个选项 var nodes = document.querySelectorAll('.price__block') for (var i = 0; i < nodes.length; ++i){ var priceNum = parseFloat(nodes[i].replace(/€/g, "")) priceNum = priceNum * 0.000020 + " BTC" nodes[i].innerHTML = priceNum; }，您可以将其设置为 navigationMode 以通过按向右箭头或点击器按钮向下然后向右滚动。

linear

https://revealjs.com/vertical-slides/#navigation-mode

如何使Reveal.js与演示者遥控器一起工作？

7 个答案: