问题标签 [impress.js]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
519 浏览

html - 为什么 impress.js 不旋转

我有点搞乱了impress.js。我想要 4 张幻灯片,想让它看起来像中间有一个正方形。

我的代码如下所示:

它最终必须看起来像这样。在此处输入图像描述

我不知道为什么它不起作用。帮助表示赞赏。

0 投票
1 回答
1725 浏览

javascript - impress.js 中的自定义转换时间

我正在尝试为impress.js演示文稿中的每张幻灯片创建不同的过渡时间。我在一本关于 impress.js 的书中找到了下面的代码。但是在 JSLint 上检查它会显示错误。我对javascript不够好,无法自己纠正这个问题。有人愿意帮助我吗?

  • 编辑:我需要一个没有 jQuery的解决方案。这是因为 impress.js 允许您使用空格键和箭头键浏览演示文稿,我不想失去该功能。

我发现在使用按键导航时(当 jQuery 正在计时自动前进时)它不尊重您导航到的位置,而是迫使您远离您所在的位置。相反,我希望如果您导航到幻灯片(位置),自动前进开始运行该特定幻灯片的自定义设置时间,并在设置的时间量过去后前进到下一张幻灯片。这将是对 impress.js 的一个很棒的补充。我希望这可以做到。谢谢你的努力!

JSFiddle: http: //jsfiddle.net/5sSE5/8/(在impress.js末尾添加的脚本)

另外:下面的脚本尊重键盘导航,但所有幻灯片都有相同的过渡时间。

0 投票
0 回答
186 浏览

javascript - impress.js 上的幻灯片更改时没有任何显示

我从 impress.js 开始,但我坚持。我想在我的演示文稿上使用立方体效果,但是当幻灯片更改时,我的内容不会出现。

我的 index.html 中有这两张幻灯片

我设置了我的css样式表

我不明白为什么我#historique_title h2的没有出现。我尝试使用firefox控制台查看,但没有找到错误的参数

有人可以帮我处理这个案子吗?

提前谢谢各位

0 投票
0 回答
404 浏览

javascript - 如何在 impress.js 演示文稿中将音频事件添加到“演示”幻灯片?

我正在尝试将音频事件添加到 impress.js 演示文稿中的幻灯片,当“当前”幻灯片加载时(或每张幻灯片将播放来自同一音频文件的选择),将播放新的音频文件。

我尝试了一些选项,包括 impress-audio.js 和 howl.js,但似乎没有一个能够在每张幻灯片上触发特定的音频事件。这似乎是一个如此简单的概念,但我一直无法找到一个好的解决方案。有什么建议吗?谢谢!

0 投票
1 回答
440 浏览

javascript - 有没有办法制作一个 prezi 然后以某种方式将其转换为 html 和 css 类型代码

我正在尝试使用 impress .js 制作一个网站,但要得到我想要的东西很长。我意识到prezi是一样的。

使用嵌入表明它是从 prezi 完成的。我想知道是否有办法解决这个问题,我可以得到 html 和 css 文件类型的实际代码

0 投票
0 回答
387 浏览

javascript - 在 impress.js 中图像/Div 变成透明(不透明)

我目前正在搞乱impress.js,我不禁注意到一些 div 或图像,当通过 impress.js 的 css 时,会变成透明的——不是透明的,只是透明的。例如,在这个 fiddle中,前两个图像是透明的,而另外两个是完全不透明的。

我不希望这两个图像像那样透明。我无法理解是什么导致只有这两个是这样,而其他人则处于相反的状态。我尝试使用不同的图片,交换图片的位置,更改和缩放元素,但它们似乎不起作用。尽管将 css 中的第 7 行更改为opacity: 1;确实有帮助,但它无法对不活跃的元素产生预期的效果,这很重要。

如果有比我知识更高的人(顺便说一句,我在这些事情上是个白痴)可以调查一下,他们的帮助将不胜感激。

提前致谢。

~sam97

0 投票
1 回答
401 浏览

html - 如何在impress js中更改幻灯片顺序

我想更改 impress.js 中的幻灯片顺序。但我无法通过添加一个 Is there a way to do this 来做到这一点?

我的代码如下所示

提前致谢。

0 投票
0 回答
232 浏览

css - -webkit-transform-style:preserve-3d;Chrome中的css缩放像素化

我正在使用 impress js 进行演示。

http://bartaz.github.io/impress.js/

在幻灯片的概览模式中,我看到幻灯片的像素化视图按比例缩小。请在 Chrome 中查看以下链接

http://bartaz.github.io/impress.js/#/overview

在此处输入图像描述

在 Firefox 中,它看起来很正常。

在此处输入图像描述

0 投票
1 回答
1148 浏览

javascript - 嵌套DIV需要替代“body.scrollTop”以在impress.js幻灯片中滚动到顶部

我正在使用impress.js框架(它显然设置了严格模式)并在尝试将嵌套 DIV 滚动到其最高位置时在 Google Chrome 中收到以下消息:

body.scrollTop 在严格模式下已弃用。请在严格模式下使用“documentElement.scrollTop”,仅在怪癖模式下使用“body.scrollTop”。

因此,当我单击“向上滚动”按钮以希望将嵌套的 DIV 重置为其顶部时,以下内容对我不起作用:

您可以在我的测试站点看到它失败:

http://www.berklie.com/stack

谁能告诉我要使用的替代代码,以便当我单击“向上滚动”按钮时可以滚动到 DIV 的顶部?

先感谢您!

0 投票
1 回答
375 浏览

javascript - impress.js 中的幻灯片边距更小?

Impress.js 似乎默认使用具有巨大左边距的幻灯片(或填充——我无法让 Firefox 的检查员清楚地告诉我)。我有一张幻灯片,它有一个相当宽的<pre>块,如果它实际上是左对齐的,它会适合,但不适合默认幻灯片。

我玩过 CSS,但似乎无法弄清楚如何让一张幻灯片(或几张幻灯片)占据整个可用屏幕空间。FWIW,这就是我想要适应的(是的:如果你是国民队的粉丝,你会注意到内容中有问题。我有理由这样做。)。这是我的幻灯片:

我最终得到了这个: 在此处输入图像描述

如果我可以使用全屏,文本会很好。

谁能建议一些 CSS 让我强制该幻灯片使用 impress.js 中的完整可用屏幕空间?我尝试使用float: left;和边距宽度,但这里的 CSS 超出了我的范围,而且我还没有看到一个印象深刻的演示,它不会挂在那个巨大的边距上。

我看过大量的演示和示例幻灯片,它们似乎都同意将屏幕左侧 20% 的空间留给开放空间。