问题标签 [impress.js]

玩 impress.js

我正在尝试实现像幻灯片过渡一样的 Reveal.js，但使用的是 impress.js。基本效果确实出现了，但我觉得，幻灯片正在“更宽”地转动，使它看起来慢了一点。

注意：在小提琴中，最大化输出部分以更清楚地看到上述问题

我不知道该怎么说，但是如果您看到http://lab.hakim.se/reveal-js/#/fragments和 http://jsfiddle.net/8ukwex3x/1/，您将能够制作出差异。

我应该怎么做才能让它像 Reveal.js 的过渡一样工作。

如何在 Impress.js 幻灯片上创建按钮 - 允许我转到演示文稿的其他部分的按钮。

我知道有下一步/上一步的代码，但我想去一个完全不同的位置/步骤。

此外，是否有一种方法可以在现有图像之上覆盖 hte 按钮。

谢谢

妮可

我正在寻找一种方法来为impress.js演示文稿中的某些幻灯片启用Bootstrap样式。我试图通过将样式添加到这些幻灯片并编译 Boostrap Less 以使其仅应用于具有该样式的这些项目来做到这一点。然而，幻灯片几乎没有展示 Boostrap 风格。bootstrapslidediv

这可能是因为impress.js首先清空了所有样式（h1, pre,...），并且引导程序添加了一些属性，但未能使更改可见。然而，我没有立即解决这个问题。

最小工作示例：

presentation.htm：

custom.css编译自custom.cssBootstrap Less 包：

custom.less

假设有以下impress.js代码：

这在屏幕上渲染得很好1920x1080，因为5( data-scale) 次2000（带有一些缓冲区的屏幕宽度）是10000.

但：

• 它在较小的屏幕上渲染效果不佳（因为1920与例如相比较大800）；和
• 对于较大的屏幕，幻灯片仍然可以重叠。

如何根据视口大小设置幻灯片位置？因此像500vw？（试过了，但是没有用）。

我目前正在开发一个使用 3D 变换作为缩放方法的网络界面。缩放是使用名为impress.js的 API 完成的，该 API只需使用 3D 变换将相机移动得更近或更远。

问题

我需要为一堆 div 创建一个方形叠加层，因为它们可能很远，我需要计算它们在屏幕上实际占用的像素数量。我想，既然我可以从相机当前的 div 中获得多少像素，我应该能够确定远处元素的表观像素大小。

我试过用角度大小来估计它，看这里。但是，当您移动得太近、太远或物体太薄或太宽时，它就不起作用了。

代码

我目前所做的看起来像这样：

但它只适用于某些元素，也不是完美的。

我有的：

• 每个元素的实际宽度/高度
• 我正在查看元素的 Z-index 中的像素数量。

我需要的

• 远处元素在我的屏幕上实际占用的像素数量。

如果有人知道我如何计算这个，我会很乐意帮助

现在 Tab 在 Impress.js 中被禁用，只是移动到下一张幻灯片。即使我删除该代码并让它正常运行并专注于链接它有点崩溃 impress.js 有没有人找到解决方案？

谢谢！

目标很简单->

说我有一句话：

“这对我来说是一个特殊的日子……”

我希望“特别”这个词被动画化（小反弹）。

这就是我尝试过的（我正在使用impress.js+ animate.css）。

索引.html：

我希望整个句子在同一行，所以我添加了“显示：内联”部分。

这在 chrome 中运行良好，但在 safari 中“特殊”这个词根本不会反弹。

如果我删除display: inline“特殊”一词上的部分，那么它在 chrome 和 safari 中都可以正常工作。（但句子将不再在同一行）

所以它看起来像代码：

我在 safari 中找不到h3具有其他样式的元素（在这种情况下为显示：内联）？

有没有更好的方法来完成这项工作？

我第一次使用 impress.js 并想进行调整。原始演示在这里看到的幻灯片在不活动时变得暗淡/透明。我在这里看到了另一个 impress.js 演示文稿，其中图像/幻灯片在整个演示文稿中保持不透明，除了第一张幻灯片（之后一切都变得不透明）。如何使特定幻灯片或图像在整个演示过程中保持不透明？

我正在寻找一种在 impress.js 中重新定位步骤（或“幻灯片”）的方法。通常，步骤以页面为中心，当您调整浏览器大小时，它们会相应地调整大小（并重新定位）（至少对于大多数屏幕尺寸而言）。我的目标是创建一个偏移量，以便“幻灯片”水平向右移动。

有人知道如何相应地修改 impress.js 吗？

提前感谢您的想法，

阿让

我正在运行一个 AngularJS 应用程序/控制器。我的目标是在动态加载到我的主页中的页面上初始化和使用 impress.js 库。但是，当我尝试初始化库时，页面没有加载。附件是控制器和 html 文件的片段。

注意：当我将impress()对象打印到控制台时，它不为空，并且具有所需的功能。我怀疑该impress()对象没有正确连接到页面。

控制器：

HTML 文件：