HTMLベースで作成できるプレゼン用スライドのまとめ

ブラウザでスライドを表示し、HTMLベースで作成できるプレゼンテーション用のスライドを簡単な操作方法と合わせて紹介します。

デモのキャプチャ

html5slides - A Google HTML5 slide template
デモページ

HTML5で実装されたスライド。
進む:スペース、Enter、矢印右
戻る:Back Space、矢印左
フルスクリーン:F11

デモのキャプチャ

DZSlides
デモ

HTML5+CSS3で実装されたスライド。
進む:矢印左
戻る:矢印右

デモのキャプチャ

Shower
デモページ

HTML5で実装されたスライド。
プレゼンテーションモード:Enter
解除:Esc
進む:スペース、矢印右
戻る:矢印左

デモのキャプチャ

HTML5 3D effect caroussel presentation

HTML5で実装されたスライド。
進む:矢印右
戻る:矢印左
拡大:矢印上
縮小:矢印下

デモのキャプチャ

Pure CSS Slideshow
デモページ

pure CSSで実装されたスライド。
操作:マウスクリック

デモのキャプチャ

CSS3 3D Slideshow
デモページ

CSS3で実装されたスライド。
進む:矢印右
戻る:矢印左

デモのキャプチャ

CSSS
デモページ

CSSで実装されたスライド。
進む:矢印右・下
戻る:矢印左・上
先頭:Home
最後:End

デモのキャプチャ

Slippy
デモページ

jQueryで実装されたスライド。
進む:矢印右、スペース、ダブルクリック
戻る:矢印左
サムネイル:Esc、Tab、Delete

デモのキャプチャ

jQuery Presentation Plugin: Say NO to Keynote!
デモページ

jQueryで実装されたスライド。
進む:スペース、Enter、矢印右
戻る:矢印左

デモのキャプチャ

Ascensor
デモ

jQueryで実装されたスライド。
進む:矢印右
戻る:矢印左

top of page

©2017 coliss