2014-04-01から1ヶ月間の記事一覧
ページ構成を図案化する Webサイトの構成を考える サイトマップを作る（Webサイトの構成を図案化する） 手書きの設計図を描く（大まかな配置を決める） デザインカンプを作成する Cacoo Googleアカウントで使う 「ログイン」→「Googleアカウント」 「図の一…
Googleドキュメント→Googleドライブ Googleドライブへアップデート 「ドキュメント」をクリックすると「アップデート」を促されます 「詳細はこちら」をクリックすると「Googleドライブ」のページに誘導されます 右上の「無料の５GB・・・・」をクリック 「G…
連想配列 配列の場合「０」から始まる添字で要素を指定しましたが意味的な関連性はありません その添字の代わりに、「キー」と呼ばれる文字列で要素を指定します 連想配列は、「Objectオブジェクト」というオブジェクトとして扱います 連想配列の生成 new演…
Arrayオブジェクトのメソッド 配列は、Arrayオブジェクトのインスタンスです 配列をオブジェクトとして扱うと、あらかじめ用意された便利なメソッドを利用できます 要素を joinメソッドで連結 要素の増減にかかわらず、そのまま連結して表示します <html lang="ja"> <head> <meta charset="UTF-8"> <title>Array</title></meta></head></html>…
曜日を日本語で表示する 曜日の文字列は、「days配列」に格納しておきます <script> var days = new Array('日', '月' ,'火', '水', '木', '金', '土'); </script> Dateオブジェクトを作成 曜日は、getDayメソッドを利用する1 getDayメソッドの戻り値は「日曜日〜土曜日」を「…
配列とは リストのこと いくつかの情報を番号と一緒に保管するためのもの 「配列」とは、添字（そえじ）と呼ばれる番号を用いて、１つの変数名で複数のデータをまとめて管理できるようにしたもの 配列 - マンガで分かる JavaScriptプログラミング講座 配列は…
Webサイトのラフデザインを作る 例：私がwebサイトのラフデザインを制作する時の流れ コンセプト・ターゲット・サイト構成を決める クライアントがどういうものか クライアントがどういうところを目指しているのか ターゲットはどのような人か Webサイトを作…
リサーチ・下調べ クライアントに訪問する前に前提知識を得ておく 競合他社の分析 検索エンジンを使った下調べ コンセプトシート ヒアリングや打ち合わせを通してサイトの概要を把握したら「コンセプトシート」を作成します コンセプトシートに盛り込む内容 …
誰のためのWebサイトか 失敗するWebサイトは、はじめからわかります サイト制作者が社内（または作り手の）事情ばかり考えて、ユーザーのことを考えて作らない場合、必ず使いにくいサイトができあがります 以下、個人作業では考えにくいことも多いのですが「…
Jimdo 「好きなサイト100選」を作る 「無料ホームページを登録」
《脳科学的》運のいい人になる5つの方法 自分を大切にする 自分を大事にする姿は、他人に伝わる 愛車をていねいに扱うように、自分自身にも心を配る。ピカピカなクルマなら他人も大切に扱ってくれるように、自分を大切にしている人には、ていねいに接してく…
Q1 以下のスクリプトで実行をすると、どのような結果が表示されますか？ <script> var x = 'ABC'; if (x != 'ABC') { console.log('OK'); } else { console.log('NG'); } </script> Q2 以下のスクリプトで実行をすると、どのような結果が表示されますか？ <script> var x = 10; if (x </script>…
JavaScript ステートメント（命令文）の終わりはセミコロン「；」 ステートメントは、上から順に実行される 命令に与える値を、引数（ひきすう）という 文字列と数値の扱いの違いに注意する メソッドはオブジェクトに対する処理 メソッドは、「オブジェクト…
Stringオブジェクト 文字列を「Stringオブジェクト」という特別なオブジェクトとして扱うことができる Stringオブジェクトのプロパティは「length」 文字列リテラルとして記述 <script> var str1 = 'Stringオブジェクト'; </script> new演算子とStringコンストラクタを使って…
Mathオブジェクト Mathとは「数学（Mathematics）」の意味 数値演算に便利なメソッドやプロパティが利用できるオブジェクト まえもってインスタンスを生成する必要はありません スタティックメソッド（インスタンスを生成しないで関数のように使用できる） M…
オブジェクト JavaScriptに用意されている組み込みオブジェクト Webページが表示された時点で利用できるオブジェクト 必要に応じてユーザーが自分で生成するオブジェクト Dateオブジェクト 日付時刻をデーターとして管理する Dateコンストラクタを引数なしで…
関数（function） 関数とは、何らかの処理をひとつにまとめて「関数名」という名前で呼び出せるようにしたもの 関数は「function」キーワードで定義する 「Number」など、JavaScriptには予め関数が用意されています 関数に渡すなんらかの値を「引数」と呼び…
break文 for文やwhile文で、指定した回数だけ処理を繰り返す途中で「中断」する 処理の中断 <html lang="ja"> <head> <meta charset="UTF-8"> <title>繰り返し処理と中断</title> <script> var i = 1; function ans(){ switch ( i ) { case 1: alert('【ヒント】北海道は県ではありません'); break; case 2: alert('【ヒント】東</meta></head></html>…
while文 for文との違いは、ループのカウンタとして使用する制御変数の扱い for文の場合は、制御変数の初期化や増減の式をforの直後の「( )」内に記述 while文の「( )」では、条件式のみを記述し、制御変数の初期化や増減は別に命令する 変数の初期値； while…
for文 指定した回数だけ処理を繰り返す 変数「i」の初期値（「i」は、indexの意） 処理を１回実行するたびに、変数「i」の値をどのように変更するか for ( 変数の初期値； 繰り返し条件； 変数の変更 ) { 実行される処理 } 変数の値を１ずつ増やす演算子 「+…
switch文 値に応じて処理を分岐する 「（）」の値に対応する case文にジャンプし、break文でブロックを抜けます 文字列を数値に変換するNumber関数 入力ダイアログボックスを表示する promptメソッドの戻り値は文字列です 戻り値を数値として扱うには、文字…
if文 if文は条件によって処理を分けて行うときに使います。 条件には比較演算子や論理演算子を使った条件式を指定します。 a = 5; if(a % 2 == 0) { document.write(a, 'は偶数です。'); } else { document.write(a, 'は奇数です。'); } if(a % 2 == 0) ：a÷…
JavaScriptで画像置換 JavaScript Reference：onMouseOver CSSは必要なし！ onmouse属性を使った簡単なロールオーバーの作り方 要素に直接記述（インライン） onMouseOver = " this.src = ' img/◎◎.jpg ' " onMouseOut = " this.src = ' img/◎◎.jpg ' " サム…
連想配列とは 連想配列は、数値の代わりに意味のある文字列をインデックスとすることで、各要素を識別しやすくすることができます 連想配列の場合、インデックスのことを「キー」と呼びます 連想配列の宣言と初期化 連想配列の要素は、キーと値のセットで１…
配列とは 配列とは、同じ用途で用いる複数の変数を１つにまとめたもの 配列は要素の集合体 配列は変数の集まりによって構成されます 個々の変数のことを「要素」と呼びます 各要素を識別するために「インデックス」と呼ばれる番号（０から始まる整数値）が割…
変数の表示 変数の中身を表示するには、「console.log」や「alert」の丸括弧（）内に変数名を指定します 変数名をシングルクォートまたはダブルクォートで囲むと、囲まれた範囲は単純な文字列となり、変数名がそのまま表示されてしまいます 《変数の中身の表…
算術演算子 数の計算に用いる演算子を算術演算子といい、複合代入演算子には、次のようなものがあります。 演算子読み仮名働き使い方結果 +プラス＋（足す）a = 5 + 5 10 -マイナス−（引く）a = 5 - 5 0 *アスタリスク×（かける）a = 5 * 5 25 /スラッシュ÷…
2カラムレイアウトの設計 テキストはレスポンシブレイアウトの設計ですが、PC用のみの設計をします 画像はテキスト参照 レイアウト設計 PICKUP STREAM Twitter Facebook Google Plus RSS Feed HOME ABOUT CONTACT 1 AUG 海岸のデコレーション CATEGORY: 海と…
JavaScriptでクロスフェード jQueryのバージョンを確認する APIかダウンロードかを決める <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script> Brand Spanking New <script> window.onload = function() { var cf = new Crossfader( new Array('cf1','cf2','cf3', 'cf4', 'cf5'), 500, 2000 ); } </script> 500はフェードエフェ…
ブラウザに文字を表示 「Hello World!!」とブラウザに表示させる <html lang="ja"> <head> <meta charset="UTF-8"> <title>Hello!</title> </head> <body> <script> window.document.write( 'Hellow World!!' ); </script> <noscript> JavaScript対応ブラウザで表示してください。 </noscript> </body> </html> 文字列の表示 JavaScriptで文字列を表示するには、「wind…
