slides/example_notes.htm at main · frodonh/slides · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
<!DOCTYPE html>
<html lang="fr" data-duration="1h">
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">

	<title>Notes de présentation</title>
	<link rel="stylesheet" href="dewdrop/template_notes.css">
</head>
<body>
	<h1>Slides.js</h1>

	<h2>Slides.js in a nutshell…</h2>
	Slides.js is a lightweight framework to generate animated slideshows using templates.

	Templates can be easily developed, using only CSS declarations, even for the animations and dynamic components (outline slides, background images, footer…).

	<h2>Main features</h2>
	Slides.js is packed with features:
	<ul>
		<li>The slides are automatically resized to adapt to the screen size.</li>
		<li>By typing on the "O" key, you can get an overwiew of all slides and easily move between them.</li>
		<li>Presenter notes are available and synchronized with the slideshow status, this document is an example.</li>
		<li>People in the audience can get the slideshow on their own device and view it automatically synchronized with the talk.</li>
		<li>Transitions between slides are animated and configurable.</li>
		<li>Inside each slide, you can have several fragments which are animated individually.</li>
		<li>The whole slideshow may be configured with CSS only.</li>
		<li>Outlines slides are automatically generated based on headings in the source document. Outlines are fully clickable.</li>
		<li>The slideshow may be browsed using the keypad or a touch device.</li>
	</ul>

	<h2>This is the source of this slideshow</h2>
	This is the full source of this slideshow. It demonstrates many features of Slides.js. You can use it to create your custom slideshows.

</body>
<script src="template_notes.js"></script>
</html>