でざいんとうぇぶ。|WEB学習

WEBスクール半年間の学習過程

9/19|JavaScript - switch文,配列 / Illustrator

09/19

JavaScript

- switch文の特徴

switch文は、単純な分岐を簡潔に記述したいときに使う
分岐処理を行う文法には、if文とswitch文がある

18日のif文は分岐選択が2択(増やすことも可能)
switch文は選択肢(分岐)が増やせる

 break; ← 区切ると認識させるための記述

続きを読む

9/17|JavaScript基礎

9/17

- jsを画面に表示

<title>はじめてのjs</title>
</head>
<body>
<script>
document.write('test');
</script>
</body>
</html>

<head></head> ← ブラウザの裏側だけなら<head>内に(計算式等)
<body></body> ← ブラウザの表に表示する場合なら<body>内に

 ====

- js基礎

<title>変数</title>
</head>
<body>
<script>
//変数宣言
var a;
//代入
//右辺から左辺に値をいれること
a = 1;
//出力
document.write(a);
document.write('a');

a = 2;
document.write(a);
console.log(a);
</script>

 

>> 1a2

document.write(a); ←数字情報として表示
document.write('a'); ←''で文字情報として表示
-
document.write(a); ←ブラウザの表に表示 console.log(a); ←ブラウザの裏側に表示

 

- js基礎

<title>+演算子の挙動の違い</title>
<script>
//変数を宣言しつつ足し算
  var x = 123 + 456;
//変数を宣言しつつ文字列結合
  var y = "123" + "456";
//以下コンソールで出力
  console.log(x);
  console.log(y);
</script>
</head>

 

//変数を宣言しつつ足し算
  var x = 123 + 456;      ←574 足した数値になる
//変数を宣言しつつ文字列結合
  var y = "123" + "456";    ←123456 並べた数値になる

 

- 計算式一覧

<title>四則演算</title>
<script>
//足し算
var ans = 1 + 2;
console.log(ans);
//引き算
ans = 3 - 2;
console.log(ans);
//掛け算
ans = 5 * 3;
//割り算
ans = 6 / 3;
//剰余(余り)
ans = 7 % 3;
</script>

 

 

- 代入 / 計算

f:id:tk3m:20140929085407p:plain

23→a(23)

a(23) + 23

= 表示

 

46(上記の答) - 23

= 表示

 

'こんばんは' → b('こんばんは')

b('こんばんは') + 'たもりです'

= 表示

 

- 代入 / 変数

f:id:tk3m:20140929085348p:plain

a = a + 3

a += 3 (略称) 

= 同じ意味

 

a  → a(6)

a(6) + 3

= 表示

 

b(7) + c(9) = b(合計値)

= 表示(b)

 

9/10|レイアウト / パターン画像

9/10

- 2カラムレイアウト

f:id:tk3m:20140920031047p:plain

wrapper ← overflow: hidden; を必ず記述

flort:left : fort:right ← 左右に記述

biv id ← レイアウト用
biv class ← 記事内等

 

続きを読む

9/9|ナビゲーション制作

9/9

 - ナビゲーション設定

f:id:tk3m:20140920030739p:plain

制作ソフト(ai,ps)でナビゲーションを制作し表示させる

- ナビゲーション制作

f:id:tk3m:20140926051130p:plain

通常ナビゲーションとホバー(選択中)ナビゲーションの制作

 

続きを読む