jQuery APIでWebサイトを演出しよう

目標となるサイトを確認する

全333コースを10日間無料で

ぜひご覧ください。

無料で視聴する すべての加入プランを見る
または
サンプルサイトの完成形を見て、これからどのような演出を実装するかチェックしてみましょう。
講師:
02:39

字幕

このレッスンでは目標となるサイトを確認してみましょう。まずレッスンフォルダーのsite_begin というフォルダーの中のindex.html をChrome で開いてみましょう。このようなサイトが開かれると思います。このサイトは JavaScript を使用していない HTML と CSSそして少々の画像で構成されたサイトになっています。トップページがこのような状態になっていて、そして企業情報をクリックすると仮想ページとして1ページ、このようにページが作られています。それでは final のフォルダーも見てみたいと思います。フォルダーの中のsite_final の中にあるindex.html をドラッグアンドドロップでChrome のタブに落としましょう。そうすると、このようにこのキャッチコピーの部分が最初動き、マウスを重ねると色が変わります。また背景の方もスライドになっていて、こちらは矢印を押すと一枚前に戻るや一枚次に送るなどの機能もあり、また、この下の矢印を押すとコンテンツの方にゆっくりスライドしたりまたある程度スクロールをするとこのように上に上るボタンが出て、こちらをクリックするとページトップまでこのようにスムーズに戻ることもできます。 また企業情報のページの方にはフォトギャラリーがあり、こちらをクリックするとこのようにポップアップで写真を出す事が可能です4枚あるので4枚の画像を次々と閲覧できます。そして Google Map が埋め込まれていますが通常 iframe で埋め込むようなマップではなく、API からデータを取得して自由にカスタマイズすることによってこのようにオリジナルのアイコン等も表示することが可能です。このように、元々は動きのないサイトにインタラクティブな要素を追加してサイトを彩っていきましょう。このレッスンでは目標となるサイトの確認を行いました。

jQuery APIでWebサイトを演出しよう

jQueryはJavaScriptを効率良く記述することができる、世界中で広く使われているライブラリです。APIとは外部のウェブサービスを自分のサイト内で利用できる仕組みのことです。このコースではjQueryやAPIの基本を学習したのち、jQueryのプラグインやGoogle APIなどの実践的な使い方について学びます。

2時間43分 (22 ビデオ)
現在、カスタマーレビューはありません…
 
ソフトウェア・トピック
価格: 2,990
発売日:2014年05月29日

このコースは、「オンデマンド」でご利用可能であり、ダウンロードすることもオンラインで見ることもできます。

ダウンロードすると、オフラインでコースを使用し、豊富なインターフェースをフルに活用できます。複数のデバイスを使用したり、 一度に全コースをダウンロードしたくない場合は、アカントにログインして、ストリーミング・ビデオとしてコースのレッスンを視聴してください。

ビデオトレーニングをお楽しみいただけますように! お問い合わせは、cs-jp@lynda.com宛までご連絡ください。