ENG
  • KOR
  • ENG
  • JPN

deck.js

ui-component animation layout

deck.jsは、現代的なHTMLプレゼンテーションを実現するための軽量JavaScriptライブラリです。このライブラリを使用すると、Webベースのスライドショーを簡単に作成し、CSS3を使用してスタイルとアニメーションを適用することができます。

Latest Ver 1.1.0
Homepage
Github
0
5,423
あなたのプレゼンテーションが芸術になる。
deck.jsで簡単で魅力的なスライドを作成しましょう。
HTMLベースのプレゼンテーションを迅速かつ簡単に作成するためのライブラリ

CDNダウンロード

License: MIT
すべてのバージョンを見る
https://cdnjs.cloudflare.com/ajax/libs/deck.js/1.1.0/core/deck.core.js
https://cdnjs.cloudflare.com/ajax/libs/deck.js/1.1.0/core/deck.core.min.js
https://cdnjs.cloudflare.com/ajax/libs/deck.js/1.1.0/extensions/goto/deck.goto.js
https://cdnjs.cloudflare.com/ajax/libs/deck.js/1.1.0/extensions/goto/deck.goto.min.js
https://cdnjs.cloudflare.com/ajax/libs/deck.js/1.1.0/extensions/menu/deck.menu.js
https://cdnjs.cloudflare.com/ajax/libs/deck.js/1.1.0/extensions/menu/deck.menu.min.js
https://cdnjs.cloudflare.com/ajax/libs/deck.js/1.1.0/extensions/navigation/deck.navigation.js
https://cdnjs.cloudflare.com/ajax/libs/deck.js/1.1.0/extensions/navigation/deck.navigation.min.js
https://cdnjs.cloudflare.com/ajax/libs/deck.js/1.1.0/extensions/scale/deck.scale.js
https://cdnjs.cloudflare.com/ajax/libs/deck.js/1.1.0/extensions/scale/deck.scale.min.js

Sample Code

⚠️ import 文を含む一部のコードは、jsFiddleで正しく実行されない場合があります。エラーが発生した場合は、コードをコピーしてご自身の環境でお試しください。 
📄 HTML
<section class="slide" id="slide1"><h1>Welcome to deck.js!</h1><p>Create modern HTML presentations.</p></section><section class="slide" id="slide2"><h2>Slide 2</h2><p>More content here.</p></section><script>$(function() { $.deck('.slide'); });</script>

🎨 External CSS
<link href="path/to/deck.js/core/deck.core.css" rel="stylesheet">

🧩 External JS
<script src="path/to/deck.js/modernizr.custom.js"></script>
<script src="path/to/deck.js/jquery.min.js"></script>
<script src="path/to/deck.js/core/deck.core.js"></script>

⚙️ JavaScript
$(function() { $.deck('.slide'); });

Related Libraries

Library Icon
impress.js

impress.jsは、CSS3の機能を利用して動的でインタラクティブなプレゼンテーションを作成できるJavaScriptライブラリです。

Library Icon
reveal.js

reveal.jsは、ウェブベースのプレゼンテーションを作成するためのオープンソースライブラリで、ユーザーがHTMLを使用してインタラクティブで視覚的に魅力的なプレゼンテーションを簡単に作成できるようにします。

⚡ Top Tools for Developers
Text Compare

テキスト比較

2つのテキストの違いを一目で確認できます。

Favicon Generator

Faviconジェネレーター

簡単かつ迅速にファビコンを生成します。

Lorem Ipsum Generator

Lorem Ipsumジェネレーター

デザイン用のダミーテキストを生成します。

Character Counter

文字数カウント

文字数と単語数をリアルタイムで確認できます。

SRT ↔ SMI

SRT ↔ SMI変換ツール

字幕形式を簡単に変換できます。

Text Extract(OCR)

画像テキスト抽出

画像内のテキストを自動で抽出します。