前夜祭のプレゼンで使ったスライドですがscript.aculo.usを使って改造しています。改造方法をちょっとだけ紹介します。script.aculo.usというのはPrototype.jp上で動くエフェクトライブラリで、簡単にWEBサイト上の部品にアニメーションのようなインタラクティブな効果を与えることができます。あの有名なLightboxなどもscript.aculo.usを使い作られています。script.aculo.usの公式サイトよりライブラリをダウンロードします。ダウンロードしたファイルを解凍しlibディレクトリの中身とsrcディレクトリの中身をサーバー上のjsディレクトリにアップします。(ディレクトリ構成は好みに別れますがボクはjsディレクトリにまとめて配置する人です。SlidyのHTMLファイル内にアップしたscript.aculo.usを取り込む処理を追加します。Slidyのjsファイルです。)最後にslidy.jsにエフェクト効果を追加します。今回ボクが選択したのはAppear、フェードインしながらの表示が可能です。slidy.jsをテキストファイルなどで開いて以下の箇所を変更します。node;}1638行位1062行位はページ切り替えの際にdisplayをblockにする処理をscript.aculo.usに変更しています。1638行位はincremental(部品を一つづつ表示するclass)をdisplayにnoneを与えてからscript.aculo.usに表示する処理に変更しています。これだけでこんな素敵な効果が表現可能です。Slidy(もしくはS5)でプレゼンを行ったのはボク一人でした。なかでもkeynote人口は高くPowerPointより普及している感じです。名前:メールアドレス:URL:コメント:to-RについてJavaScriptやCSS、React/Angularなどのフロントエンド情報を発信しています。GitHub株式会社トゥーアールについて渋谷にあるフロントエンドに特化したWeb制作会社です。フロントエンドの実装についてお困りの事がありましたらお気軽にご相談ください。