今すぐ登録して、23,200件以上登録されている、業界エキスパート指導のコースを受講しましょう。
「ライトボックス機能」とは？
このレッスンでは ライトボックス機能とは どういったものかについて― 完成版をプレビューしながら 確認していきたいと思います 今 画面に表示されているのが 今回のこのコースで制作していく― 架空のウェブサイトとなっています そして ライトボックス機能を 実装する箇所ですが― こちらのウェブサイトの中の― こちらの部分となります このフォトギャラリーの中の各写真に対して― ライトボックスの機能を 実装していきたいと思います それでは こちらの写真を クリックしてみましょう このようにクリックすると 背景が黒色の透過色となって― 真ん中に写真が大きく表示されてきます そして こちらにバツ印がありますね このボタンをクリックすることによって 写真を閉じることができます このようなかたちですね これがライトボックス機能というものです 勿論 他の写真にも同じ機能が付いています こういった形ですね このような形です 以降のレッスンでは このライトボックス機能を― jQuery と jKit プラグインを使って― 実装していく方法について 解説していきたいと思います 以上でレッスンは終了です 今回はライトボックス機能とは どういったものかについて― 完成版をプレビューしながら確認致しました 次からのレッスンでは このライトボックス機能を― 実装するための HTML CSS の コーディング方法について― いくつかのポイントをご紹介していきますので そちらも合わせてご覧ください
エクササイズファイルを使って実践してみましょう。
インストラクターがコースで使用しているファイルはダウンロードできます。見て、聞いて、練習することで、理解度を深めることができます。
コースをダウンロードして学習しましょう。
ラーニングコースをダウンロードしてオフラインで視聴しましょう。ダウンロードしたコースはLinkedInラーニングのモバイルアプリ (iOSまたはAndroid) で視聴できます。