WebデザインのためのjQuery入門

第3回|WebデザインのためのjQuery入門 -ドロワーメニューの実装-

おためし受講中
  • 授業で使用する教材

    実装後の出来上がり見本はこちらです。

    ※授業以外での利用は禁止します

「授業フィードバック」で、授業の感想を教えてください!

チュートリアルは、こちらの「その他のオプション」からいつでも確認いただけます。

コピーしました!

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

再生位置挿入 資料挿入
筆記アシスト
ONOFF
    全6回 2015年10月24日公開
    WebデザインのためのjQuery入門 -ドロワーメニューの実装-

    Web制作に欠かせないjQueryの基本を、スマホUIにおけるインタラクションの実装を通じて学んでいきます。
    3限目は、ドロワーメニューのコードをjQueryで書いていきます。

    ■ jQueryとは

    皆さんは、Webサイトの画像がスライドしたり、ページがスムーズにスクロールしたり、画像をクリックしたらライトボックの中に画像が美しく表示されるのをご覧になったことがあると思います。そのようなサイトのインタラクションを実装するためのものとしてjQueryは人気を誇ってきました。

    jQueryはJavaScriptのライブラリです。JavaScriptにはブラウザによって動作が異なるという弱点がありましたが、jQueryを使う事によって、IE6等のレガシーブラウザから最新のブラウザまで、ブラウザの違いを気にせずにインタラクションが実装できるようになりました。

    ■ 事前準備

    公式サイトからjQueryをダウンロードしておいてください。
    https://code.jquery.com/

    【ダウンロード方法】
    リンク先の『jQuery 1.x』下にあるminifiedを右クリックしてファイル保存します。
    または左クリックをして表示されるscriptタグをHTMLに貼り付けてお使いください。
    jQuery 2.x以降はIE6〜8に対応していません。

    この授業ではテキストエディタとブラウザを使用します。お手持ちのエディタ、ブラウザで構いませんが、授業では下記を用います。

    テキストエディタ
    Atom https://atom.io/

    Webブラウザ
    Google chrome https://www.google.co.jp/chrome/browser/desktop/index.html

    受講生代表

    • 江川 みどり

      江川 みどり

      スクー放送部

    教室画面の機能をご紹介します

    学習機能を活用して、効率よく学習しましょう!