コース: WebデザイナーのためのjQuery 実践講座

今すぐコースを受講しましょう

今すぐ登録して、23,200件以上登録されている、業界エキスパート指導のコースを受講しましょう。

「スライドショー機能」の設定項目

「スライドショー機能」の設定項目 - jQueryのチュートリアル

コース: WebデザイナーのためのjQuery 実践講座

「スライドショー機能」の設定項目

このレッスンでは jKit プラグインを使った― スライドショー機能を実装する為の 設定項目について解説していきます まずは ダウンロードしてきたこちらの slideshow-setting ― というフォルダーの中に入っている こちらの index.html ファイルと― そして こちらの js フォルダーの 中に入っている― この javascript.js ファイルを エディターで開いて下さい そして これがそれらのファイルを 開いた状態です 左側には index.html ファイル そして 右側には― javascript.js ファイルを 表示させています これらのファイルを使って 今回のレッスンの解説を― 進めていきたいと思います それでは 早速レッスンを始めていきましょう まずは 前回までのレッスンのおさらいです 前回までのレッスンではこちらのスライド部分 この部分ですね この部分に対して jKit プラグインを使って― スライドショー機能を 実装する所まで行いました 今回はそのスライドショー機能に対しての 機能や 動作を調製する為の― 設定項目についてみていきたいと思います それがこちらの部分となります それでは 上から順番に 見ていってみたいと思います まず このスライドショー機能の 設定項目ですが― こちらの jKit の後の括弧の中の 第二引数にこの様に波括弧で囲った中に― 書いていく事が出来ます 今回ご紹介するのは三つの設定項目です まず一つ目は autoplay そして 二つ目は animation そして― 三つ目は interval です 他にも設定できる項目はありますが 今回は主要なこちらの三つの項目に対して― ご紹介していきたいと思います まず一番上の autoplay autoplay はその名の通り スライドショーの自動再生をするかしないか― といった設定になります 今回は yes としていますね この様に書く事でスライドショーを 自動再生する事が出来ます 次にこちらの animation です この animation はこちらの値に書いた 内容で画像の移り変わりのアニメーションを― 表示させる事が出来ます 今回は fade としていますね この様に書く事で画像の移り変わりの際に 現在 表示されている画像を―…

目次