Reveal.js | 初期設定
概要
Reveal.js における、各種属性の初期設定について。
Reveal.jsのhtmlの最下部の、
Reveal.initialize({
// 略
})
に設定を行うことでスライド全体に対する初期設定をします。
サンプルコード
デフォルトの設定を色々と変更してみます。
Reveal.initialize({
controls: false, // 右下のコントロールを非表示
progress: false, // 下部の進捗バーを非表示
slideNumber: true, // 右下にスライドのページ番号を表示
history: true, // 各ページをブラウザの履歴に残す
overview: false, // Escで表示できる「概要」ページを表示不可にする
center: false, // スライドの垂直方向中央表示をしない（上寄せになる）
touch: false, // タッチ操作を無効化
loop: true, // スライドをループさせる
rtl: true, // 右から左へのスライド
fragments: false, // fragmentsを無効化する
autoSlide: 1000, // 自動スライドをミリ秒単位で設定。デフォルトは0（自動スライドしない）
autoSlideStoppable: false , // 左下の自動スライド停止用のボタンを非表示にする
mouseWheel: true, // マウスのホイールによるスライドを可能にする
transition: 'cube', // キューブ状の transition でスライドを動作させる
// 設定値 default/cube/page/concave/zoom/linear/fade/none
transitionSpeed: 'slow', // スライド速度を遅く設定。 設定値 default/fast/slow
// 視差背景の画像URL設定
parallaxBackgroundImage: 'https://s3.amazonaws.com/hakim-static/reveal-js/reveal-parallax-1.jpg',
// 視差背景のサイズを設定
parallaxBackgroundSize: '2100px 1024x',
});