gpt4 book ai didi

javascript - Reveal.js 幻灯片放映不工作

转载 作者:行者123 更新时间:2023-11-29 19:57:37 25 4
gpt4 key购买 nike

我正在尝试使用 Reveal.js 框架制作幻灯片,但出于某种原因,它对我不起作用。它只是显示一个空白屏幕。这是我目前所拥有的 ( jsfiddle ):

    <!DOCTYPE HTML>
<html>
<head>
<link type="text/css" href="http://lab.hakim.se/reveal-js/css/reveal.min.css" rel="stylesheet" media="all">
</head>

<body>
<div class="reveal">
<div class="slides">
<section>hello world</section>
<section>second slide</section>
<section>third</section>
</div>
</div>

<script type="text/javascript" src="http://lab.hakim.se/reveal-js/js/reveal.min.js"></script>
</body>
</html>

编辑:解决方法是在结束body标签前添加如下代码:

<script type="text/javascript">
Reveal.initialize({

// Display controls in the bottom right corner
controls: true,

// Display a presentation progress bar
progress: true,

// Push each slide change to the browser history
history: false,

// Enable keyboard shortcuts for navigation
keyboard: true,

// Enable the slide overview mode
overview: true,

// Vertical centering of slides
center: true,

// Loop the presentation
loop: false,

// Change the presentation direction to be RTL
rtl: false,

// Number of milliseconds between automatically proceeding to the
// next slide, disabled when set to 0, this value can be overwritten
// by using a data-autoslide attribute on your slides
autoSlide: 0,

// Enable slide navigation via mouse wheel
mouseWheel: false,

// Apply a 3D roll to links on hover
rollingLinks: true,

// Transition style
transition: 'default' // default/cube/page/concave/zoom/linear/fade/none

});
</script>

https://github.com/hakimel/reveal.js

最佳答案

这是因为您在 css 的这一行中将您的部分设置为 display: none:

.reveal .slides>section,.reveal .slides>section>section

使用类似 Firebug 的检查器工具来查看为这些部分设置的 CSS。

关于javascript - Reveal.js 幻灯片放映不工作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/15719747/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com