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

html5slides - A Google HTML5 slide template
デモページ
HTML5で実装されたスライド。
進む:スペース、Enter、矢印右
戻る:Back Space、矢印左
フルスクリーン:F11

HTML5+CSS3で実装されたスライド。
進む:矢印左
戻る:矢印右
[ad#ad-2]

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

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

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

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

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

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

jQuery Presentation Plugin: Say NO to Keynote!
デモページ
jQueryで実装されたスライド。
進む:スペース、Enter、矢印右
戻る:矢印左

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