WebデザインノートBOOK

Webクリエイターに関する勉強を書き記したブログになります。

※はてなCSS編集用の記事（閲覧不要）※

あああ

いいい

ううう

えええええええええ



    1. Ordered List01ああああああああああ
      ああああああ
    2. Ordered List02ああああああああああああああ
    3. Ordered List03あああああああああああああああああああああああ
    • Unordered List01いいいいいい
    • Unordered List02いいいいいいいい
    • Unordered List03いいい改行↓
      いいいいい
    1. Ordered List01ああああああああああ
      ああああああ
    2. Ordered List02ああああああああああああああ
    3. Ordered List03あああああああああああああああああああああああ

olの後にulを続けて書くと(改行も含む)、
ulを勝手にolに変えてしまうらしい。



    1. Ordered List02ああああああああああああああ

【olのキャンセル】

    • Unordered List01いいいいいい
    • Unordered List02いいいいいいいい
    • Unordered List03いいい改行↓
      いいいいい
Definition List title01
ぽぽぽぽーん
Definition List title02
ぽぽぽぽーん
Definition List title03
ぽぽぽぽーん
Definition List title04
ぽぽぽぽーん
<!--[if lte IE 6]>
<script src="js/DD_belatedPNG_0.0.8a-min.js" type="text/javascript"></script>
<script>
	DD_belatedPNG.fix('#wrapper img');
</script>
<![endif]-->



：
：




20120201192001


くっそーーーーー！！IEざけんじゃねええｗｗｗｗｗ
ﾀﾞｲｿﾝ氏もお怒りだ。

IEで見たら狂っておりました。
まだIE対応を全くしてません。

IE６で透過PNG

9/20ｸﾗｽ授業 HTML JavaScript

透過pngをIE6で表示させようとすると、99％以下の透過部分がグレーになってしまいますよね。

透過pngをIE6で表示させる為には、winの拡張API機能であるDirectXを使用して、IE6独自のCSSフィルターであるAlphaImageLoaderというものを使って、他ブラウザと同じように透過画像を表示させる…

…らしいのですが、こんなん知らなくっても大丈夫です。


    1. まず「 DD_belatedPNG.js 」をググってダウンロード。
    1. 透過pngを使いたいページのhead内に下記のソースを加える。
<!--[if lte IE 6]>
<script src="DD_belatedPNG.js" type="text/javascript"></script>
<script>
	DD_belatedPNG.fix('#wrapper img');
</script>
<![endif]-->

（jsファイルを置く階層は、上記の場合はページのソースと同じ階層。）


Googleマップが表示されなくなる

DD_belatedPNG.jsを使用するとGoogleマップが表示されなくなるそうです。その場合、DD_belatedPNG.jsを効かせて透過させる部分を限定することで回避できる。

２で組み込んだソース内で指定する「DD_belatedPNG.fix('#wrapper img');」の部分を、限定して指定する。

透過させたいimgが含まれている部分（divやpなど）に、特定のclassを指定する等すれば、細かい振り分けができていいかも。

フォルダ内のファイル一括検索＆一括置換

Grep＆GrepReplace

仕事中とても便利なものを見つけたのでメモ。
サクラエディタの追加機能です。
その機能は、「複数のファイルの文字列を一括で置換する」です。
使用には外部マクロ登録をします。


複数ファイルの同一文字列を一括で置換する方法


まあ...DWでもできるんですけどねｗ


サクラエディタ

サクラエディタって便利ですよ。

例えば、テキスト選択。
通常のテキストエディタで出来るのはこんな感じ。
20120124150346

これに加えてサクラエディタの場合は縦方向の選択も可能。
20120124150722


これで、似た行が並んだものの一部分だけを編集可能になります。



あと何よりExcelとの連係の良さが半端無いです。

とある企業サイトのトップページメインFLASH＆メモ

Flash その他

20120123131154


コンセプト

青白基調
ほんわかゆったり
...etc

で作りました。
スクリプトは最後のループのみ。
（電球と蛍光灯がゆっくりぼんやりする）
他はタイムラインフレームのみで作成。


※青白カラーはずーーっと見ていると貧血気味になります。
作成後、手足痺れて変な汗がでてきました(笑)


メモ

IE6で透過pngを使う

WEBのお仕事

本日、授業開始時にちょこっとだけお話させていただきました。
驚くほどトーク力低くてごめんなさい...orz(笑)


WEBのお仕事については、
単に「WEBのお仕事」と一括りにできないほど様々なポジションがあり、
それぞれ全部極めようとしたら、短期間にはまず無理な話しです。
ただ、当たり前ですが殆どの事はやればやるほど上達しますのでご安心ください。


HTMLを始めて最初のうちは「頭」が「手」に追いつかなかったのが、そのうち「手」が「頭」に追いつかなくなります。頭の中にどばーーーっとその"先の設計図"が出てくるのに、手が追いつかない。天○飯の四妖拳か四身の拳が使いたいくらいです。慣れってすごいですね。

20120116165909



とにかく、授業をちゃんと受けていれば驚くほどベースが出来上がっていると思います。ベースを活かすも潰すも自分次第であります...


Photoshop素材メモ

Photoshop VIP

cookie・session｜PHP

PHP

cookie

<?php
$myId = $_POST['my_id'];

setcookie('my_id', $myId, time() + x);
?>

$_POSTはinput領域に入力された値の取得ですね。
setcookie()の引数は、
第１引数：クッキー名
第２引数：クッキー値
第３引数：クッキー有効期限
第４引数：有効範囲パス
第５引数：有効ドメイン
第６引数：セキュリティ(trueを設定するとHTTPS接続の場合にのみクッキーが送信される。デフォはfalse)
第７引数：http(知らなくていいと思う…)
実行後は、成功するとtrue 、失敗するとfalseを返す。

<?php
if (isset($_COOKIE['my_id'])) {
	$myId = $_COOKIE['my_id'];
} else {
	$myId = '';
}
?>

：

<input type="text" name="my_id" id="my_id" value="<?php echo $myId; ?>"

上記phpソースの中で、ページへ入る度に変数「my_id」へ設定する。
cookieが保存されている場合は中に記録されているID名を、
cookieが保存されていない場合は空の値を、
それぞれID入力欄へと書き込む。


session

<?php
session_start();
if (isset($_POST['my_id'])) {
	$_SESSION['my_id'] = $_POST['my_id'];
}
?>

$_SESSIONでinput領域に入力された値を保存する。
session_start()関数でセッションの生成・復元を行う。

<?php
session_start();

session_unset();
header('Location: input.php');
?>

session_unset()関数でセッションの解除。
header()関数は、指定したURLへリダイレクトを行うものです。
この場合は、再度ID入力画面へ飛ばし、セッションが切れたことを伝える意味を表しています。

メモ
jQuery
etc.リンク
教科書サポートリンク