無料サーバ用に新規ＨＰ企画を考えてみた

　借りる目的は、直リンクしたいのだけど、
どうせＨＰ作るなら、自分の為にもなるものでないとね。
さらに、直リンクのみは問題なので、新規ＨＰでも直リンク
したものを使用するという前提で。

　ということで、まあ、今まで作成してきたJavaScriptを
後世に残す意味で、その解説・紹介的なもの、その他に、
どうせなら、皆さんへの提供を行うようなＨＰにしたい。

　ＨＰタイトルは、「JavaScript Tool」とか「JavaScriptツール」は、
同じようなタイトルありますね。
ということで、もっとＨＰ内容を明確に表現するということで

「7maru JavaScript ツール」は。。。

なんか、そのままじゃない。。。。どうも芸がない気が。。^^);;
ただし、先頭が数字だとディレクトリで並べた時に始めの方に
出てくるので有利でも有るけどね。

　で、内容なんだけど。。
先頭ページは、いろいろなツールを各ジャンル毎にまとめるような
構成になると思うので、BayStars Skierの先頭と同じ感じで。
いや芸がないので、もっとカッコええページにしたい。
じゃ、無料素材とかで飾るかで、探したけどピンときたものがない。

で、やはりページ全体を統一したいので、
いっそのことブログと同じにしよう。
カラオケのがいいので、これを１ページ物に変えて行こう。

ということで、まずは目次を、

【Freeツール】
　　●ブログツール
　　　　　●スライド表示
　　　　　●階層（折り畳み）メニュー
　　　　　●カテゴリ毎のスタイルシート自動切替
　　　　　●ソフト（ポップアップ）メニュー
　　○ホームページツール
　　　　　○スライド表示
　　　　　○ソフト（ポップアップ）メニュー
　　　　　○勝敗表グラフ
　　　　　○碁盤
　　　　　○ゲーム（クリックもぐら等）
　　●ホームページ作成支援ツール
　　　　　●ファイル参照時、ローカル・サーバ両方使用可能にする。
　　　　　●表示参照文字変換
　　　　　○打撃表作成
　　●クイズツール
　　　　　●クイズ
　　　　　●ｘｘｘ度チェック
　　○ＯＴＤ掲示板ツール
　　　　　○midi切替
　　　　　○イラスト浮遊
　　　　　○荒し対策
　　　　　○順位予想掲示板
　　　　　○リアルタイムクイズ掲示板
【作成アプリ】
　　●ゲーム一覧
　　　　　●クリックもぐら
　　　　　●クリックもぐら画像版
　　　　　●１０００本ノック
　　　　　●ペナント競争
　　　　　●スキー回転競技
　　○その他
　　　　　・クイズ：タイムショット
　　　　　・カラオケ応援歌
【おまけ】
　　●デバッグ方法
　　　　　●レイアウトが崩れる原因
　　　　　●管理人のJavaScriptデバッグ方法。
　　●世の中の情勢
　　　　　●Mozilla　が何とdoument.allをサポートした！！
　　　　　●最近、ブログは置いといて、ＳＮＳにハマってます！！
【サイト情報】
　　●当サイトについて
　　　　　●利用規約
　　　　　●リンクについて
　　　　　●更新履歴
　　●ＦＡＱ
　　　　●ＤＯＣＴＹＰＥ指定での注意
　　　　　以下を参考にしてみてください。
　　　　　　　　●正確に記述しないとしっぺ返しを食らう。
　　　　　　　　●DOCTYPE宣言でデザインが崩れる？（枠線はどっち側）！！
　　　　●ＣＳＳのバグですか？
　　　　　・http://cssbug.at.infoseek.co.jp/index.html：ＣＳＳバグリスト@CSSバグ辞典スレッド
　　　　　ここは、2ちゃんねる掲示板内のCSS/DHTMLのバグを扱うスレッドをまとめたサイトです。
　　　　　これ非常に助かりますね。
　　　　●ＣＳＳ変更したらおかしくなった。
　　　　　まず次の入力ミスをチェックしましょう。管理人もミスります。^^);;
　　　　　　　　・「：」を書き忘れた。　　　　　→ｌｅｆｔ　２０ｐｘ；
　　　　　　　　・色の指定で「＃」を書き忘れた。→”００ｆｆ００”
　　●お助け掲示板
　　○カスタマイズ掲示板
　　●ゲストブック
　　●管理人について
　　　　　・サイト運営ポリシー
　　　　　・他運営サイト
　　　　　・お世話になっているリンク集


　内部ＰＣのディレクトリ構成は、js7からぶら下げる。

　まずは、公開などせずに、作っていくことを優先。
ある程度できたら、公開等する。

したがって、まずは直リンク可能にするのが先決。
そこでブログツールから作る。

●BLOCKBLOGツールは、BLOCKBLOGページ構成は同じで、内容簡略化して作る。
　●各カテゴリ毎（HP,カラオケ、ボーリング、てんてん丸、ＭＹ、
　　このブログ、BLOCKBLOG）に１個のみのindex.htmlを作る。
　●バックナンバー等のリンクには、この７個のindex.htmlを割当てる。
　●ＣＳＳファイルは、BLOCKBLOGと同じものとする。
　●各カテゴリのhtml内容は、作成容易性のため先頭のカテゴリ名以外はすべて同じにする。
　●html内でツール説明には不要なもの（ＲＳＳ関連、BLOCKBLOG関連等）は全部削除。
　○てんてん丸のタイトル画像を変更しよう。→後でやろう。
●JSの改良点。
　　●ユーザ定義テーブルの一部が未定義の場合でもエラーにさせず無視する。
　　●他のJavaScriptと同じにならないように、外部変数・関数の先頭にjs7を付ける。
　　●ソフトメニュー：
　　　●現在moreがバックナンバーにだけ固定で設定できるけど。
　　　　その他のカテゴリも沢山表示してる人いるので、
　　　　他のカテゴリも対応し、さらに最新のトラバなどは３行で１組なので
　　　　対象カテゴリ毎にmore表示個数を指定させる。
　　　●なお、現在はmoreを含んだ個数なので、これでは３行１組とは
　　　　いかないので、指定する値は、moreを除いた個数とする。

　　　●さらに階層メニューで[+][-]をカテゴリ名の先頭に指定させたので
　　　　これがあれば、削除する。
　　　　●このために従来のmenu幅が120pxだとIE/operaでは右側にはみ出し、
　　　　　縦に隙間が開いてしまう。
　　　　　ということで、挿入は、いろいろ問題発生するので、
　　　　　absolute指定のみに変えよう。
　　　　●ＣＳＳ含めたサンプル作る。
　　　　　　→画像が指定してあるエリアのpadding-topをメニュー幅増やす。

　　　●現在、ソフトメニューの書式は、プログラムで設定しているが、
　　　　これだとカスタマイズが大変なので、
　　　　ＣＳＳファイル内でカスタマイズ出来るように変える。

　　　●その為メニューのdt/dd領域の書式をＣＳＳファイル内に
　　　　記述してもらうようにする。
　　　　　　●マウス乗り色をＣＳＳファイルから取得する
　　　　　　　　　　→　仮のＤＩＶ領域を生成して取得。
　　　　　　●現在はソフトメニュー色がシルバーであるが、
　　　　　　　他の色でないとデザイン的にまずいのも当然あるので
　　　　　　　色変更の解説必要かも。
　　　　　　　　→ＣＳＳで指定するので詳細説明は不要でサンプル記載。
　　　　　　●ただし、ピンク系、薄茶色系を作り実際に使う。

　　　●現在はbox領域を下にずらし、その間にソフトメニューを配置てるけど、
　　　　これだと、上下に繋がった背景画像の間に隙間が開いてしまうので
　　　　デザイン的にまずいのもあるため、どうなるか調べとこ。
　　　　　　●contentをabsolute指定しているＣＳＳだと、
　　　　　　　IE,Mozzila,operaともに、
　　　　　　　box領域をabsolute設定した時点で、
　　　　　　　contentの配置がおかしくなり、
　　　　　　　なおかつそれぞれ異なる表示形態に。
　　　　　　　　ＩＥ：box領域内でtop位置が下に150pxぐらいずれてる？
　　　　　　　　Mozz：box領域の下に配置される。
　　　　　　　　oper：box領域内でtop位置が150pxぐらいずれる？
　　　　　　　　　　　さらにbox領域の横サイズが小さくなる。
　　　●ということで、box領域を下にずらすのは、
　　　　デザイン次第で問題が発生するので、box領域はずらさず、
　　　　ソフトメニューの幅は、ＣＳＳでユーザに指定させる方法も作る。
　　　　　　→やっぱ、ずらす方式は、かなり問題発生し混乱しそうだし、
　　　　　　　ＣＳＳで空きを作る方法だと、デザインには影響がないし、
　　　　　　　さらにどこでも配置可能で、ユーザの自由度も増すので、
　　　　　　　この際、こちらの方式に変えてしまおう。
　　　　配置位置は、例えばbox領域の左上とか、content領域の左上とかを
　　　　指定可能にするために、ブロック領域のid名で指定させる。
　　　　このブロック領域の左上位置を取得して、
　　　　topとlefに設定させることで、位置指定に柔軟性を持たせる。
　　　　さらに微調整の為にtop,leftに調整値をプラスしてあげる。

　　　●現在は、ソフトメニューを横に配置する方式のみだが、
　　　　ユーザが位置を自由に指定でき、書式も自由に設定できるので、
　　　　横配置の他に、縦配置を作ってしまおう。
　　　　●考え方は、dtとかddを取り出してdivに流し込む方式を
　　　　　まず考えたが、これだと現在のプログラムを大きく変えなければ
　　　　　ならず、ちょっとややこしいので、
　　　　　dl領域をもうひとつコピーし、片方は、dtのみ使い、
　　　　　もう片方はddのみ使うようにして、それぞれで位置を変えれば
　　　　　いいのではという考えで作る。
　　　　●注意点は、dt領域を見えなくすると、dt領域がなくなるので、
　　　　　dd領域が先頭に移動する点。
　　　　●カーソルがメニューに乗ると、色を変えているが、
　　　　　元のデザインがＣＳＳで変えられるので、この色を固定に
　　　　　するのは問題なので、やはりＣＳＳファイルで指定させるように
　　　　　しないといけないが、では、どうやってその値を取得するか。
　　　　　これは、ＤＯＭ２（Views）とＤＯＭ２（style）に書いてあるので、
　　　　　すなわち、ＣＳＳで指定された値が、実際にレンダリングされた
　　　　　ときに、その値が取得できる以下のプロパティがあるようだ。
　　　　　・外部cssファイル中の書式が反映された後の読み込み：
　　　　　　Mozilla/opera:
　　　　　　　　document.defaultView.getComputedStyle(obj,null).
　　　　　　　　　　　　　　getPropertyValue('background-color')で可能
　　　　　　ＩＥは未対応なので、IE独自の以下で対応：
　　　　　　　　obj.currentStyle.backgroundColorで可能
　　　　　　Safariだと、document.defaultViewはＯＫだが、
　　　　　　.getComputedStyle以降が付くとエラーになる。バグ？
　　　　　　ということでいろいろ調べたら、ここのサイトに各ブラウザの
　　　　　　ＤＯＭ２（ＣＳＳ）対応調査一覧が載ってたので、
　　　　　　　　document.getElementById(id).style.
　　　　　　　　　　getPropertyValue('background-color')はエラーにならない
　　　　　　でSafariは、上記はnullを返す。Mozilla/opreaはnull以外を返すので、
　　　　　　これで切り分け、Safariは、nullを返すようにした。
　　　　　ということで、仮のid名をＣＳＳファイル内で指定させ、
　　　　　それを仮のdiv領域を作成して、その反映値を取得し、
　　　　　仮のdiv領域は隠しておく。
　　　　●ここで、ソフトメニューのタイプをユーザに指定してもらうが、
　　　　　この指定がＣＳＳファイル内で出来ればベスト。
　　　　　で、どうすればよいか考えてみた。
　　　　　考え方としては、ＣＳＳファイル内に仮のid要素名を
　　　　　横配置用か、もしくは縦配置用のどちらかを指定しておいて、
　　　　　このid要素名を取得できれば、ＪＳファイル内に記載しなくても
　　　　　指定できる。
　　　　　で、これは、ＤＯＭ２（style）に書いてあるので
　　　　　すなわち、ＣＳＳファイル内で指定する
　　　　　セレクタ（書式要素の識別値：#id名、.クラス名、タグ名とか）を
　　　　　以下で取得可能である。
　　　　　・外部cssファイル中のセレクタ名読込
　　　　　　Mozilla:
　　　　　　　　document.styleSheets[0].cssRules[i].selectorText;
　　　　　　IE 5.x以上：
　　　　　　　　document.styleSheets[0].rules[i].selectorText；
　　　　　　opera7.23：
　　　　　　　　document.styleSheetsはOpera7.23では、undefinedです。
　　　　　というこで、Operaが未対応ということで、この方式は見送った。
　　　　　いや、タイプだけ指定しても位置を指定しないと意味無いので、
　　　　　この方式は結局ボツ。
　　　　　変りに、ＣＳＳ自動切換えのｊｓファイル内で
　　　　　ソフトメニュータイプと位置を指定させる。
　　　　●Windowsが出来たので、safariで見てみたら、おかしい。^^);;
　　　　　●マウスを乗せた色が、マウスが離れても消えない。
　　　　　　obj.style.backgroundがnullを返すため。
　　　　　　→対策：nullならマウス背景描画は行わないこととした。
　　　　　　→対策：ＣＳＳ側でa:hoverで背景色を指定してもらうこととした。
　　　　　●moreが動かない。
　　　　　　(more)文字部分では反応しない。それより右はＯＫ。
　　　　　　→対策：対策分からない為、背景色は変化させないこととした。
　　　　　●てんてん丸、カラオケ、ＭＹ日記の書式が反映されない。
　　　　　　→ＵＲＬの問題と同じ
　　　　　●階層メニューのクリック範囲が文字部分だけ対象外。
　　　　　　→対策：対策分からず。
　　　　　●スライダー表示の画像が表示されない。
　　　　　　ＵＲＬがトンでもないところになっている/../../../../../
　　　　　　ＭＡＣだと、ディレクトリ名が英小文字は英大文字になる。
　　　　　　→大文字変換したものとも比較してあげる。
　　　　●ここで右メニューってのがあるみたい。
　　　　　ということは、右メニューに縦型を配置すると、
　　　　　プルダウンは、右側でなく左側に表示させないといけない。
　　　　　これは、画面の残りの横幅を見て自動的に変える方法もあるが、
　　　　　それだと、項目横幅が小さいのや大きいのがあると、
　　　　　これは右、これは左と分けが分からなくなるので、
　　　　　やはり、ユーザにどっちなのと指定させよう。
　　　　　●で、右メニューを作るには、
　　　　　　単純にＣＳＳのfloat要素でmenu領域とcontent領域を
　　　　　　左右逆に指定すればいいし、
　　　　　　ソフトメニュー位置は、menu領域の左上を指定した。
　　　　　　そしたらなんと、ＩＥがなぜか画面の上の方に表示される。
　　　　　　Mozilla,operaはＯＫ。
　　　　　　類推するに、ＩＥは、親のＤＩＶ領域（box）からの相対位置を
　　　　　　offsetTop,offsetLeftに返してるんじゃないかと。
　　　　　　でＩＥのＨＰ見たら、しっかりと、親座標を基準とした座標値を
　　　　　　返すと。ああああーーーー、なんなのＩＥさんは。。。。
　　　　　　いろいろ試してみたけど、ちょっと諦めた。
　　　　　　で、結局、box領域からの相対位置のみ指定させることにした。
　　　　　　でも、既に色んな領域を指定させるように作っちゃったので、
　　　　　　これ今更変えるの面倒なので、
　　　　　　BLOCKBLOGの場合は、必ず"box"を指定してよ、で行くことに。
　　　　　●で、縦置きの左側配置は、ｄｄ項目の横幅を求め、
　　　　　　その幅分左側に寄せればよい。
　　　●機能説明：を書く。
　　　　●動作条件、利用可能な方の条件
　　　　●テーブル説明。
　　　　●注意：ｄｄが無ければ、ソフトメニューには表示されない。
　　　　●トラックバックは、ddが３行がひとつの組なので、
　　　　　more表示する場合は、more最大数は３の倍数で指定する。
　　●階層メニュー：
　　　　一番いいのは、
　　　　カテゴリ名に[+][-]を指定させるやり方に変更すること。
　　　　現在は、テーブルで対象カテゴリ名を設定しているので、
　　　　そこを、対象領域id名（menu等）をテーブルで持ち、
　　　　　これが存在するものについて、
　　　　　その子ノードでnodeNameがＤＬのOBJの
　　　　　DTの中身の先頭が[+]か[-]のobjに対して
　　　　　　　[-]なら、そのままで、イベントを登録する。
　　　　　　　[+]なら、ＤＤを隠し、イベントを登録する。
　　　　●BLOCKBLOG関係のjs変更。
　　　　●index.htmlも変更
　　　　●ＵＰ後にBLOCKBLOGのカテゴリ名に[-][+]追加
　　●スライダー：現在画像を表示しているだけだが、
　　　各画像をＡタグで括り、リンク可能に改良する。
　　●単機能でjsをメニューブロックに配置し、
　　　配置したブロックを消す機能。
　　　　→これは、スタイルシートで対応してもらう。
　　　　　　　追加する「どこのもブロック」の名前をxxxxとすると、
　　　　　　　スタイルシートに以下を追加する。
　　　　　　　　　　　#xxxx {
　　　　　　　　　　　　　　display: none;
　　　　　　　　　　　}
　　　　　　　注）id名の先頭文字は半角英字のみ許され、
　　　　　　　　　半角数字は許されないので注意。^^);;
　　　　　　　●BLOCKBLOGで許可か否かを調べてみたが、出来ちゃいますね。
　　　　●bayski.jsを単機能に分け、
　　　　　●index.htmlをjsカテゴリ分けし、
　　　　　●各cssに追加し、
　　　　　○BLOCKBLOGにjsカテゴリを登録する。→面倒なのでやめた。^^);;
　　　　　　この結果、条件は、
　　　　　　　・js7Libは、一番最初に配置すること。
　　　　　　　・js7ChangeCssはフッターに登録すること。
　　　　　　●BLOCKBLOGには、bayski.jsとjs7ChangeDss.jsで登録しとこ。
　　　　　●説明時は、ｊｓファイルと、機能の表で、
　　　　　　何が必要で、直さなければ行けないのはどれを明示。
　　●ホスト・ローカル切替は、対象となるｊｓファイルには、
　　　必ず先頭でgetRootURLでＵＲＬをゲットさせるようにする。
　　　注）これをやると、js7Lib.jsにこの関数を入れたので、
　　　　　これがその行で実行されるので、その行以前に7maruLib.jsを
　　　　　配置しないといけない。→困ったが、御願いする。
○BLOCKBLOGの文書構造依存記述を非依存記述に変える。
　すなわち、DT,DD,カテゴリ名とかは、変数にして、
　変数を変えれば、他の同一の階層構造なら動作するように変える。
　→BLOCKBLOGはこのままで、他のブログでいいとこあれば、その時考える。

●BLOCKBLOGで使用しているｊｓファイルは、新規ＨＰでも使用するし、
　他のBLOGでも使用可能なためｊｓファイルを共通で使用したい。
　そのためには、ユーザ定義データとプログラム部分を別のｊｓファイルに
　分割する必要がある。
　ユーザ定義データは、ｊｓファイル毎に該当する定義データｊｓファイルを
　作っていては数が多すぎて大変なので、ひとつにまとめる。
　さらに、ｊｓファイルが共通で使用できることから、
　ｊｓフォルダを作り、そこで管理する。
　　　・js7Lib.js
　　　・js7ImageLink.js
　　　・js7SoftMenu.js
　　　・js7FolderMenu.js
　　　・js7SliderMenu.js
　　　・js7ChangeCss.js
　●ただし、以下は非共通とし、該当ディレクトリに置く。
　　　■js7Wakeup.js
　　　　→自分のＨＰだけ非該当で、Freeツールは全部入るので共通。
　　　●js7UserData.js
　このことから、js7UserDataは、js7Libの関数を使用しているので、
　js7Libより後ろで定義すればよい。


●各ブラウザで最終確認する。
　●Mozilla/safariでソフトメニューの左端でソフトキー閉じない
　　→マウスが対象領域のmore内にある時に、moreクリックでmore領域が
　　　消えてしまい、マウスが対象領域外に出てしまう場合に、
　　　mouseoutメッセージが来ないので、プルダウンを消すタイマを
　　　起動できないのが原因。
　　→ＩＥは、消えても、その領域からマウスを出せば、
　　　mouseoutが来る。
　　→これは、仕様不良ですよね。
　　　本来なら、消えた時点でmouseoutが来なくちゃ。
　　　Mozillaに要望として報告しておこう。
　　→で、どうしよう・・・
　　→まあ、もう一度プルダウンに入れば問題ないし、
　　　他のソフトメニューに移しても問題ないので、
　　　このまま放っておこう。^^)
　●Mozilla/safariで右縦メニューの横幅合わない（IE/operaはＯＫ）
　　→Mozilla,safariではＤＤ幅（obj,offsetWidth）を、
　　　求めると、最後のＤＤ以外は、なぜか最大幅になる。
　　　最後のＤＤだけは合っているが、
　　→これは、よく分からんが、バグなの？？？
　　　どうもonLoad時に見てしまうと、おかしいので、
　　　でもmore表示時はＯＫみたい。
　　→原因らしき：サンプルでは、全角英字をｄｄ項目に書いているが
　　　これだと表示時に半角英字で表示されるため、
　　　offsetWidthで取得するサイズは全角英字のサイズで、でも表示は
　　　半角英字なので、おかしくなっているようだ。
　　→プルダウンを開くときに位置を合わせてやるように替えてみた。
　　　そしたら、最初だけ位置が合わない。
　　　ということで、onLoad時は、一応位置が合わなくてもLeft位置は
　　　セットしておけば、ＯＫ。
　　　ということで、解決策が分かるまで、かなり苦労した。^^);;;
　　●と思ったら、今度はsafariで、ほんのちょっとだけずれている。
　　　→調べると、ＤＴを配置後に、なぜかレイアウトがずれてる。
　　　　これがスライダー表示が起動するとずれるようだ。
　　　→いろいろ調べたが、スライダ表示でスライドする画像の高さを設定
　　　　すると、content領域が右にちょっとだけすれる。
　　　　なぜだかは不明。
　　　→ということで、ギブアップ。仕方なく発想を変えて、
　　　　レイアウトがずれるなら、それに合わせてＤＴもずらしてやればいい。
　　　　ということで、何とか解決。
　　　●なお、more表示をする際にＤＤ項目をずらしながら表示しているが
　　　　これがＤＤ項目の文字の長さにより、ＤＤ項目の幅が変わる。
　　　　これもついでに対処した。
　●Safariの縦メニューで、プルダウンの動作がおかしい。
　　→「バックナンバー」をプルダウン表示し、プルダウン上で、
　　　下にマウスをずらして行くと、次の「カテゴリ」の位置に来ると
　　　「カテゴリ」のプルダウンに切り替わる。
　　　他は、「最新のトラックバック」の位置に来ると、
　　　「最新のトラックバック」のプルダウンに切り替わる。
　　→IE,Mozilla,operaはＯＫ。
　　→右縦メニューはＯＫなんだよね、これが。。。。
　　→なんじゃこれは？？？
　　→イベントの発生状況をモニタしたところ、
　　　safariは、問題となるところで、DLからイベントが発生していた。
　　　それに伴い、プルダウンが切り替わっている。
　　　DLでイベントが来たときに、処理するようになっていたのを
　　　処理しないように替えてＯＫ。
　●operaで別ウィンドウ開くと、クイズが表示しない。
　　　新規ウィンドウのＨＴＭＬのＢＯＤＹ部のscriptタグで
　　　２行以上に渡る（多分jsファイルはＯＫなんだろう）場合に、
　　　それ以降のタグが無視される。バグなんでしょうか？？
　　→クイズだけ別ウィンドウにしないで、同じ画面に表示しちゃおうか。
　　　いや、面倒なので、別ウィンドウ用とオペラ用のリンクを付けて
　　　使う方に判断任せちゃおう。
　●operaがサンプルで動作しない
　　→上記理由に同じ。

それと、ソース配布は、ダウンロードではなく、
ソース公開でコピペしてもらおう。
こうしておいた方が、誰にでも見れるので公知になるしね。
→ただし、現在のブログ形式画面だと、１行のソースがはみ出すので、
　新規ウィンドウを開いて見せることに。

そこで、HTML上で表示するには、表示参照で記号類を変換しないといけない。
この変換は、
　●JavaScriptでツール作る。
　●何を変換しなくては行けないのか調べる。
　　　・＜　　　：　＆ｌｔ；
　　　・＞　　　：　＆ｇｔ；
　　　・＆　　　：　＆ａｍｐ；
　　　・”　　　：　＆ｑｕｏｔ；
　　　・’　　　：　＆ａｐｏｓ；
　　　・半角空白：　＆ｎｂｓｐ；

●著作権法
　一応、著作権法も見たけど、いろいろな権利があるけど、
　今回のFreeツールは、一度作ったものには興味がないので、
　ここに書いてあるような権利は一切いらないから、どうぞですね。

●でサーバにＵＰしたら・・・・
　●ＨＰ上の画像が表示されない。
　　　●画像が表示されないのは、ＣＳＳファイル内でＵＲＬ部分の表記が
　　　　すべて小文字に変換されてる。
　　　　→これは以前自分がＣＳＳファイルの要素名等を小文字に変換した際に
　　　　　同時に変換されていたんですね。
　　　　　windowsでは大文字・小文字を意識してないが、
　　　　　サーバ上では違えてるのが原因。
　　　　　大文字混在に替えた。^^);;
　●BLOCKBLOGは、ＣＳＳも解釈されない・・・
　　　●こちらは、大文字変換はするとして、
　　　　urlの指定を絶対アドレス指定にしないといけない。
　　　　これ修正してＯＫ