おためし受講中

挫折した人のための、初心者速習html+css【JQueryでTOP画像がクルクル動くようにしてみよう編】

html+cssを挫折した全ての人に贈るシリーズ 全5回

このシリーズは1回で完結していますが、 1回から5回まで同じサイトがどんどん完成して行く形になっています。
1回づつ完結した出来上がり見本付きの演習ファイルがダウンロードできます。

第4回:初心者速習html+css【JQueryでTOP画像がクルクル動くようにしてみよう編】

初めてコーディングを学ぶ人や、本を読んだり参考サイトを見ながらコーディングしても崩れてしまってうまく行かなかった人のためのJQuery入門です。
今回はビルボード画像がインタラクティブに入れ替わるカルーセルの作り方を学びます。

 

■ 必要なもの■

1)Sublimeのインストール(授業中コードを打つのに使います)
下記のURLからダウンロードしてください。
http://www.sublimetext.com/2
設定は何も必要ありません。インストールして授業が始まる時間に立ち上げられる様にだけしておけば大丈夫です。

2)解凍ツール (授業中配布する教材の解凍に使います)
授業中にダウンロードしたファイルをすぐに解凍できる様になっていれば大丈夫です。
(Mac OSXの場合はダブルクリックで展開します。windows7~の場合は右クリックのコンテキストメニュー「全て展開」を選択でOK)

3)その他のバージョンのOSは、MacであればApp StoreでWinArchiver Lite.appを検索してダウンロードしインストールしておきます。
Wiondwsであれば、下記のURLよりLhaplusをダウンロードし、インストールしておきます。
http://www7a.biglobe.ne.jp/~schezo/

 

学生代表

  • 未定

    未定

【ノート機能】
授業内容や覚えておきたいポイントなど、ノートに自由に残せます

再生位置挿入 資料挿入
筆記アシスト
ONOFF
    【チャプター機能】
    授業内容をピンポイントでおさえながら
    ご自身のペースで進めることができます
    【前半】授業
    自己紹介&アジェンダ
    03:58  (00:12 ~ )
    jQueryって何?
    02:35  (04:10 ~ )
    javascriptには必ず非対応ブラウザがある
    03:28  (06:45 ~ )
    jQueryのライブラリとプラグイン
    03:07  (10:13 ~ )
    jQueryの実装方法紹介
    03:15  (13:20 ~ )
    jQueryのメソッド紹介サイトの案内
    02:29  (16:35 ~ )
    実習前の準備
    06:51  (19:04 ~ )
    今回使うプラグインと演習をダウンロード
    05:00  (25:55 ~ )
    書いてみよう!
    16:40  (30:55 ~ )
    遷移後の画面を作成する
    03:55  (47:35 ~ )
    左右にスライドショーを移動できるようにする
    05:00  (51:30 ~ )
    スライドショーが移動できるか確認する
    01:55  (56:30 ~ )
    TOP画像を整理する
    03:55  (58:25 ~ )
    レスポンシブ対応しているかを確認
    05:00  (1:02:20 ~ )
    再度レスポンシブ対応しているか確認
    05:25  (1:07:20 ~ )
    【後半】質疑応答
    Q:画像が切り替わった時に、それぞれの画像ごとに、画像をクリックした際のリンク先を設定することは可能でしょうか?
    00:55  (1:14:57 ~ )
    Q:jQueryの添付はローカルでやるのとCDNでやるのと、業界標準としてはどちらなんでしょうか?
    01:50  (1:15:52 ~ )
    Q:Sublime3と2はかなり違いますか?
    01:08  (1:17:42 ~ )
    Q:23行から63行の中のscriptソースの解説をしていただけますでしょうか?
    03:35  (1:18:50 ~ )
    Q:フェードを導入するページ、導入しないページはどんなことを気をつけて決めてますか?
    03:03  (1:23:32 ~ )
    課題発表
      (1:26:35 ~ )