
Copy Link
横にスライドして複数枚の画像を表示するカルーセル。
また、画像をクリックすると、画像がポップアップして表示されるような動きのあるサイトを目にしたことはありますか?
このコースを学習すれば、たったの6時間でこのような動きのあるWebサイトを作れるようになります。
Webサイトを開発できる自信がない方も安心してください。このコースで学ぶjQueryを使えば、誰でも簡単に動くWebサイトを作ることができます!
Windows, MacなどOSを問わず開発できます。
なお、エディタはAdobeの「Brackets」を使っています。他のエディタでも問題ありませんが、動画内で使われているものと環境を合わせたい場合は、Adobe社のサイトからBracketsを無料でダウンロードしてください。
このコースで6時間でjQueryを習得し、動きのあるWebサイトを開発できるようになりましょう!
Section 1:はじめに | ||||
1 | ダウンロード資料 | 1分00秒 | ||
2 | jQueryでできること | 2分38秒 | ||
3 | jQueryとは | 3分24秒 | ||
4 | jQueryの実装のしくみ | 6分57秒 | ||
5 | jQueryを実装してみよう | 7分50秒 | ||
Section 2:jQuery 最初に押さえておくこと | ||||
6 | ダウンロード資料 | 1分00秒 | ||
7 | jQueryとJavaScriptの関係 | 3分15秒 | ||
8 | 最初にやるべきことは | 3分21秒 | ||
9 | jQueryライブラリの読み込み | 5分36秒 | ||
10 | 読み込みスクリプトの解説 | 4分34秒 | ||
11 | jQueryの読み込み確認 | Preview | 5分09秒 | |
12 | jQueryスクリプトの説明 | 3分09秒 | ||
Section 3:jQuery文法の基礎 | ||||
13 | ダウンロード資料 | 1分00秒 | ||
14 | 簡単なjQueryを書いてみよう | 7分22秒 | ||
15 | セレクタとメソッド | 8分20秒 | ||
16 | セレクタとメソッドの応用練習 | 4分47秒 | ||
17 | セレクタの詳細 | 4分45秒 | ||
18 | メソッドの詳細 | 3分24秒 | ||
19 | メソッドの効率的な書き方 | 5分48秒 | ||
20 | その他のメソッド | 7分25秒 | ||
21 | メソッドチェーン | 3分36秒 | ||
22 | イベント (1) | 3分56秒 | ||
23 | イベント (2) | 5分45秒 | ||
24 | onイベント | 7分13秒 | ||
25 | offイベント | 3分10秒 | ||
Section 4:実践的なjQuery文法 | ||||
26 | ダウンロード資料 | 1分00秒 | ||
27 | jQueryの動画 animate (1) | 6分46秒 | ||
28 | jQueryの動画 animate (2) | 7分55秒 | ||
29 | animateの応用 (1) | 4分11秒 | ||
30 | animateの応用 (2) | 5分25秒 | ||
31 | HTMLを直接操作するメソッド | 6分32秒 | ||
32 | hideメソッド | 7分19秒 | ||
33 | showメソッド | 2分58秒 | ||
34 | アコーディオン (1) | 5分38秒 | ||
35 | アコーディオン (2) | 5分22秒 | ||
36 | アコーディオン (3) | 7分24秒 | ||
37 | アコーディオン (4) | 5分31秒 | ||
38 | 関数の概要 | 3分39秒 | ||
39 | 関数の使い方 (1) | 6分31秒 | ||
40 | 関数の使い方 (2) | 6分23秒 | ||
41 | 関数の使い方 (3) | 9分13秒 | ||
Section 5:カルーセル | ||||
42 | ダウンロード資料 | 1分00秒 | ||
43 | カルーセルの実装 | 5分28秒 | ||
44 | ファイルのダウンロード | 7分42秒 | ||
45 | jQueryライブラリの読み込み | 6分13秒 | ||
46 | HTMLとjQueryの記述 | 6分04秒 | ||
47 | オプションの設定 | 5分13秒 | ||
Section 6:プルダウンメニュー | ||||
48 | ダウンロード資料 | 1分00秒 | ||
49 | HTMLページの準備 | 5分06秒 | ||
50 | HTML部分の編集 (1) | 7分32秒 | ||
51 | HTML部分の編集 (2) | 6分19秒 | ||
52 | CSSスタイルシートの設定 (1) | 6分41秒 | ||
53 | CSSスタイルシートの設定 (2) | 7分14秒 | ||
54 | 処理の手順確認 | 4分34秒 | ||
55 | jQueryスクリプトの記述 | 6分52秒 | ||
56 | プレビューと修正 | 4分32秒 | ||
Section 7:Back-to-top | ||||
57 | ダウンロード資料 | 1分00秒 | ||
58 | Back-to-topの概要 | 6分59秒 | ||
59 | jQueryライブラリの読み込みとボタンの配置 | 6分06秒 | ||
60 | jQueryスクリプトとCSS | 7分54秒 | ||
Section 8:Lightbox | ||||
61 | ダウンロード資料 | 1分00秒 | ||
62 | Lightboxの概要 | 2分50秒 | ||
63 | HTMLに画像の配置 | 7分42秒 | ||
64 | CSSの設定 (1) | 6分13秒 | ||
65 | CSSの設定 (2) | 4分58秒 | ||
66 | CSSの設定 (3) | 3分43秒 | ||
67 | Lightbox実装の手順 | 3分28秒 | ||
68 | 必要なファイルの読み込み | 4分00秒 | ||
69 | 実行のスクリプトを記述 | 3分34秒 | ||
70 | リンクの設定 | 7分21秒 | ||
71 | オプションの設定 | 4分43秒 |