4月18日(火)-JavaScript基礎

【要参考】
・【STEP4】Webページの制作「JavaScript(jQuery)の教科書.pdf」参考
JavaScript / jQuery で処理しましょう | HTML-CSS入門講座 | 情報デザイン工房 濱屋

【参考にしやすいWebパーツ】
WebParts Web パーツ | HTML-CSS 入門講座 | 情報デザイン工房 濱屋 (WebパーツP1~P13まで参考例と、実装方法の紹介)
動くWebデザインアイデア帳 | 動くWebデザインアイディア帳 (大浜先生も参考にしているサイトとのこと)

jQueryについて

jQueryを利用する時の基本事項を理解しましょう。

【参考サイト】

jQueryの利用方法

jQueryを利用する時は実装するための参考サイトを検索し利用方法を理解しましょう。
検索は、「jQuery (実装したいキーワード)」で検索します。
良く使うキーワードの例は、以下の通りです。

・スライダー
・カルーセル
・ハンバーガーメニュー
・ライトボックス
・ドリルダウン
・フェード
・スクロール など

【参考サイト】

【ワンポイントアドバイス】
Webコンテンツは様々は状況や条件、目的に合わせて利用されています。
その様々な要件定義に合わせた「デザイン」ができる人を目指し、成長に努めましょう。

メモ

◆JavaScriptの実装は以下のような方法があるが、①→③(難しい→簡単)とのこと
①JavaScript呼び出し
②jQuery呼び出し
③個別ライブラリィ呼び出し
(+CS3以降はCSSで実装できるものもある(教科書pdf参照)ので、どちらも理解しておくと良いとのこと)

◆JavaScriptは、HTML・CSSがひと通り完成した後、最後に実装するのが良いとのこと

◆JavaScriptの実装は、色々なサイトから参考にして書くのが良いとのこと
↑の参照サイト【参考にしやすいWebパーツ】などで引っ張ってくるなど

◆JavaScriptとJavaは全く別物なので、絶対に混同しないこと
JavaScriptは「JS」と略すのが普通

◆サーバーにUPを数回して、変更部分等が反映されていないとき
→キャッシュが残っている可能性があるので、以下を試す
①スーパーリロード(Shift+F5)※FnキーロックされているPCの場合は(Shift+F5+Fn)
or
②Googleで検証ツールを開いた状態で、上部のリロードボタン(円の→の更新ボタン)を長押し
→「ハード再読み込み」、だめなら「キャッシュの消去とハード再読み込み」で試す

◆ページ全体のスクショの取り方(中間部分などで途切れず画像ファイルで保存できる)
検証ツールを開いた状態で、(Ctrl+Shift+P)→実行欄の右側に、日本語なら「フル」英語なら「FULL」でボタンを押すと保存できる

コメントを残す

メールアドレスが公開されることはありません。 が付いている欄は必須項目です