• Skip to primary navigation
  • Skip to main content

Nagashima Laboratory

  • Home
  • Lecture
  • Note
  • Index
  • About

Webデザイン演習 2025 2Q(2)

2025/06/11 3・4限 DL503

今日の内容

JavaScriptライブラリの一つである、jQueryを使います。jQueryを使って作られた「プラグイン(機能追加のためのスクリプト)」を使って、スライダーなどの機能を実装します。

  • jQuery
  • JavaScriptを書くための準備
  • bxSlider
  • LightBox
  • 最終成果物について

学科サイトの編集(本日制作した部分をリンクします)

  • 学科サイトの確認
  • 入力見本 John Smith氏のページ

過去の資料

  • 資料一覧(このサイトのindexページ)

出席登録

出席簿 ※要ログイン・確認用

授業録画

授業の解説部分の録画はMoodleに掲載しています。

Moodle ※要ログイン

jQueryプラグインについて

授業内では、比較的導入しやすいプラグインを取り上げています。導入方法についてはどのプラグインも似ていることが多いので、興味がある人は、ほかのプラグインも使ってみてください。

  • jQuery スライダー
  • jQuery モーダルウィンドウ プラグイン
  • Slick(高機能スライダー、カルーセル)
  • など

近年のWeb技術を巡る流れの中で、jQueryの事例自体がやや古いことがあります。また、無料配布のものだけでなく、中には有償ライセンスのものもありますので、よく確認してください。

最終成果物について

テーマ:

  • ポートフォリオサイト(自己紹介サイト)の制作

提出物:

  • サイトマップ(画像をアップ)
  • ワイヤーフレーム(画像をアップ)
  • ウェブサイトデータ HTML・CSS(GitHubにアップロード)

提出物は全て学科サイトからリンクをはって見られるようにします。

GitHubへのリンクは、GitHubのリポジトリ(自分のマイページ。これまで作成したリポジトリの一覧)へのリンクと、ポートフォリオのGitHubページへのリンクと両方を載せるようにしてください。

提出日:

2025年7月16日(水)※授業最終日

最終成果物だけでなく、過去の演習(HTML〜jQuery)の最終締切も同日です。欠席等で未完成のデータがある場合は、確認をお願いします。

参考

[HTML] 2ページ目の作り方

  • マルチページサンプル
  • シングルページサンプル

2025-06-09 (Last Modified: 2025-06-09) Category: Webデザイン演習, 授業

Copyright © 2023–2025 · Nagashima Sayuri Laboratory