とうとう１年目 達成！あの女の人とうとう名前がなくなった 残念
① 星を描け！
ポリゴンで星型を一筆書きのように線で描け もちろんＳＶＧ
ふん！Illustrator様がいらっしゃる・・・・・アー Illustrator ポリゴンに対応してへんかったんや～
まあ 星の座標の目処はついたけど・・・・Ｗ3Ｃあさり・・・頭グラグラ
カットアンドトライを繰り返して解答！あーしんど
② 星を回転させろ！
上の星を中心で回転させる
うわっーとうとう動かすんかいなー
またまたＷ3Ｃあさりでヒントを
先月号もヒントにして なんとか解答・・・・送信
でも ＳＶＧ 図形表示さしたり、動かしたり、簡単に軽く出来るので使えそう
難点は、adobe のプラグインが必要な事か・・・
今回は 懸念材料なしなもんで、楽観！
以前のおなじみさんが１問目、２問目それぞれ別に名前が乗ったはる？
ちゅうことは、１問目をまちがえた人が、２問目に正解したはると言う事か・・・
とうとう 避けてたＩＥ５．５の問題が・・・・・
またまた 意を決してインストール
仕事用マシンにＩＥ５．０が入っているので、そこに上書き
やはり インストール終了後の再起動で途中で止まってしまいました
ひぇー 電源を入れなおして あかんわ 止まりよる
幸い 途中まで動くので、ＳＡＦＥモードで立ち上げて・・・・
何とか作業を終わらせて、再起動・・・あ～まだシステム情報の更新しとるがな～
念じて 再起動・・・・・動いたぁ！！！！涙
あ～ Win98 ME のマシン造っとけば良かったな～
① メニューを埋め込め！
インラインフレームで本文の横にメニューを表示し、その枠は立体的でない事
インラインフレームは まあどって事ないし、枠の幅を指定してやればＯＫや
アレ？立体的になってるがな
感で、ひょっとしたら 枠表示をしないように設定すれば・・・・いけた！
このごろ こういうような ひょっとしたら感が当たるようになった
先月号のポリゴン座標も ひょっとしたら感でＯＫ
やはり 鍛えられているんだと実感
② 背景を連続させよ！
①のメニューの背景に、本文での背景画像を透過させて表示させる ＩＥ５．５のみ
ヒントのマイクロソフトの Web Workshop を当たって見る
英文なもんで、たぶん transparent じゃないかと当たりをつけて
英和辞典で調べて 透明だと確信
あとは、作例に則って・・・・・・動作確認・・・・・ＯＫ！
本文も関係しているので、ＨＰに解答を作って メールにリンクを付けて送信
あとで、メニューと本文との関係をもっと煮詰めれば良かったかな？と後ろ髪を引かれる
後ろ髪をひかれつつ・・・・・・ありました！
① メニューを色分けせよ！
プルダウンメニューの各項目の背景を色分けし、文字色も変更
この問題に一発で答えられなければ TIPS & TRICKER じゃないらしい
ハハハ～ 楽勝 楽勝！！！
option の各項目に style を設定すりゃＯＫや
ＩＥでは、目論見通り・・・ＮＮ６では？？？？？？
あちゃ～スタイルが反映されてへんがな
そうか クラス分けで・・・・いけたがな
やっぱり TIPS & TRICKER じゃないらしい ト・ホ・ホ
② メニューに画像を入れろ！
プルダウンメニューの各項目の最初に画像を表示
とりあえず 本をめくっていると・・・何か list-style を使うような気がするんだが
ヒントで Mozilla をインストールして test16.html を探せと書いてある
しょうがないんで、いやな予感しつつ Mozilla をインストール
予感があるので、test16.html を探して、ソースを保存
次の日、見事予感的中！ＰＣが立ち上がりませんでした
safe mode で立ち上げて、再起動 やっぱりだめ
で、safe mode から Mozilla を消去、見事回復
もう ブラウザ専用マシン 本気で考えなアカンわ
test16 でモロに解答が書いてあったので Mozilla の動作裏付けはないものの
ＮＮ６で動作確認・・・・・・・・送信
懸念材料なしなもんで、楽観！
もう ２問目なんておなじみさんの名前しかない
普通の人は Mozilla なんて手を出さないからね～
今回は非常に困った！
Lynx だと！ Lynx は文字表記のみのブラウザで、私の好みではない・・私の情報発信と相反するブラウザ
その昔、モザイクが出来る前に逆行している気がする。私がインターネット始めた頃、まだモザイク云々という言葉が聞こえていたが・・・
その当時 サイトは文字だらけで、けっして面白いモノではなかった
まずは その Lynx 探しから・・・なかなか これや！というサイトがなく困り果てた
Lynx にも色々なバージョンがあって、最新版を特定するのも一苦労
なんせ 学術的な人達に支持されてるブラウザだけあって 説明が難解
一言過激に・・・デザインの仕事でも同じだが、技術系、学術系の人達は自分の基準で事を説明する・・・ごめん
ダウンロード後も 動作を理解するのに時間を費やしてしまった
① ６でＰＮＧ、３でＧＩＦ！
OBJECT タグを使って、ＰＮＧが表示出来るブラウザにはＰＮＧ画像を、そうでないものにはＧＩＦ画像を表示
Ｗ３Ｃを調べて解答のあたりはすぐついたが、ＩＥではあまり良い動作をしない？
本文では、ＩＥに触れていないので、ＮＮ３～６の範囲で考える事に
Ｗ３Ｃの構文どおりだとＮＮ６はＰＮＧを表示するのだが、ＮＮ３,４では何も表示しない？
構文からはずして考えたら表示出来るようになった
② Lynx にマップを見せろ！
ホンマ もうアカンと思いました。覚悟決めました
これもＷ３Ｃで解答は解っている・・・が・・・動作の裏付けが出来ない
それで、前出の Lynx あさりとなりました・・・解答が解ってて、くやしいじゃないですか
解答をいじって、例のように表示出来るのを確認
ありゃ？ＮＮ６ではアカン マップリンク表示せえへん
<p>のタグを元に戻すとＮＮ６ではＯＫ が Lynx ではレイアウトが少し変わる
まあ Lynx のバージョンの関係と割り切って送信
送信後も悶々として、ソースをいじってみるが・・・
ああ ここに敗戦の弁を書く日もちかいなあ
覚悟していました
ありました！ 思わず笑いが・・・複雑 少々甘めにしてくれはった
解答を見ると 冷や汗がダラダラですわ 根本的な間違いはなかったが、考察が少々足りなかった
第一問なんぞ正解者が３名 モチロンお馴染みさんの彼も入っている
彼との一騎打ちの様相を呈している
山口氏がんばれ・・すんません実名書いてもた
しかし、私 少々疲れてきました
まあ 気を取り直して、今月もトライしよう・・・
① 水玉模様を描け！
枠線を水玉で表現。ＣＳＳのみで、画像は使わない
ヒントの記事とにらめっこ。うん だいたいの目星が付いたのでトライ！
四辺それぞれの水玉の色を変えさすのがミソやなあ
カットアンドトライを繰り返して解答
② 幾何学模様を描け！
テーブルの枠を使って縦横のボーダーをアレンジ
お決まりのＷ３ＣあさりとMicrosoft Web workshop あさり
イマイチヒントを掴めないで困った・・・又 覚悟決めなアカンな～
困ってても埒があかないので、<border>タグをいじくってみる
double と背景色の組み合わせで何とかいくな～
後はそれぞれのセルのボーダーをスタイルシートで指定して送信
まあ いけるでしょ とタカをくくって解答を見る
第１問は、「色に関して４つひとまとめに記述したほうが簡潔になると指摘した解答者もいた」
と書いてあるおりの解答で先ずはＯＫと
第２問は「FRAME="hside"」で指定かぁ・・・考えが足りんかった
まあ どちらも正解にして頂いた事で ヨカッタ ヨカッタ
ここんとこ こんなんばっかりで、もっとスマートに行かなアカンな～ 反省
① ハートマークを描け！
「&」で「&」が表示出来るように、同じ手法でハート、スペード、クラブ、ダイヤ
を描け
ＨＴＭＬ４で規定されてるものだから、当然お決まりのＷ３Ｃあさり
なかなかたどりつけない・・困った
第２問で Unicode を探さなければならないので、同時平行にと考えた
Unicode で指定して・・・アカン表示されへん
う～ん やっぱりキーワードで指定せな コードがちゃうらしい
もう一度 Ｗ３Ｃに戻り、特殊文字表を探し出し ホッと一息
しかし 見にくい！
英文だけなんで、カッコつけて言語をiso表記する・・・と
ＩＥ４で見事文字化け・・オーソドックスにjisに直してＯＫ
スタイルシートで、font-familyとすると あれ？おかしい・・マークの間隔がバラバラに
font-face（推奨されていない）にすると 文字が変？
しゃーないんで、別々に指定 まあＩＥ５．５だけの問題ですけど・・・
ひょっとして うちのＩＥだけかも知れない
と ぼやきながら送信
② 雪だるまを描け！
Unicode でお天気マークを描く
ちょうどＸＭＬをいじろうか と考えていたところなんで、Unicode 番号さえ解れば楽勝
甘かった・・・Unicode 表プリントアウトしようとしたらＡ４―164ページ
泣く泣くプリントアウト・・・あれ？ヒントに「ＩＭＥパッド」で文字を探す・・・うーん？
そうや！！ＮＴにはUnicode 表が標準装備 ＮＴを立ち上げて 一発やった
その間もプリントアウトの音が空しく・・・もちろん 途中で止めました・・ゴミです
後はＮＮ６で表示確認し、スタイルシートで化粧して送信
ＸＨＴＭＬ 1.0 が昨年勧告されて（本来はＨＴＭＬ 5.0 だったモノ）
従来のＨＴＭＬと同じタグを使えるＸＭＬ文書となるらしいです
そのタグはすべて小文字で表記が望ましい事
もー又変わんのかいな
今まで あやふややったもんで、Ｗ３Ｃ、ＨＴＭＬ4.0 に則してます文書
つまり、<!DOCUTYPE HTML PUBLILIC～W3C//DTD HTML 4.0～>をよう書かんかった
もっと書きづらくなるな～
来月でとうとう１年半になります
なんとか 虫の息状態でここまで来ましたわ いつプチっとつぶされるかわからんけどなぁ～
１年半達成・・・ようもまあ１年半も続けたモンや
今回は久しぶりに正解者が多かった
おなじみさんの顔ぶれに新人が２人・・・どちらも女の人らしい？
① Centerなしでセンダリング！
ＨＴＭＬ４に則したやり方で、テーブルをセンダリングせよ
<CENTER>タグを使わないでスタイルシートを使い、ＣＳＳ２に則し実現する
やっかいである
当然Ｗ３ＣとＣＳＳ２あさりである・・・さっぱり見当がつかない？？
ＣＳＳ２の表についての項目を参考書をみながらチェックするもむなし
う～ ボックス要素にして・・・アカン インライン要素にして・・・アカン
３日が過ぎた（もちろん これだけに懸かっているわけではない ちゃんと仕事もしての話）
やめよかな～・・・もうこんだけしてんから・・・弱き心がムクムクと
３日め夜半 見落とし発見「題名の位置と端揃え」の項目が
ヤッタ！発見
ちゃんと<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">と宣言せなセンタリングしないのには感心した
まるで先月分のこのページ見はったような展開ですわ
ほっとして送信
あ～っ callspacing="5" 入れるの忘れてた！ 態勢に影響がないと判断し、そのままに
② 自動的に画像を入れろ！
<P>タグの段落の最初に画像を入れる。<IMG>タグを使わないで、スタイルシートで ただしＣＳＳ１（ＩＥ６がＣＳＳ１しかサポートしていない為）
これは比較的簡単に・・・リストスタイルにして、今年の２月号と同じように考えて
このままだと画像が画面の外になるので、margin-left で形を整えてＯＫや
ちょうど新しいＰＣが来たので（mad computer 参照）ＩＥ６をインストールし、検証が出来た
送信
大変やったけど 結果はＯＫなもんで楽観
またまたお馴染みさんしか名前がない
アレッ？山口氏の名前がナイ！！
ここで１年半やったのに～どないしたんやろ
ここに来て 疲れはったんやろか・・と勝手な憶測・・なんかライバルが居なくなると気が抜けてなぁ
① メニューからスタイルを選べ！
ＮＮ６の[表示]→[スタイルシートを使用]で、ユーザーが用意されてる複数のスタイルを選ぶようにする
当然お決まりのＷ３Ｃあさり
これは一発やったが、alternate を指示するかどうかで迷う
まあ 指示なしやったら最後のスタイルがディフォルトで適用されるのであまり深く考えないでおこう
単純に回答するのもなんなんで、リンクでＨＰの隠しページで例のごとくタヌキの絵を使って 四季を題材に
これは どっ～て事ないな と 送信
② 時間によってスタイルを変えろ！
時間によってスタイルを変える ただし document.write でタグを書かない
書き古しましたが アキマヘン 出来まヘン キーがおまへん
思いつくがままにインターネットにアクセスして見るが、ヒントなし もちろん本にもダメというやり方しか書いてない
ただ Web Workshop で document.styleSheets で複数リンクスタイルにアクセス出来るのを知る
だが、ヒントの<LINK>タグの有効、無効には結びつかないが、他に考えつかないので何とかここから打開策を考えることにする
<LINK href="xxx.css"; title="oooo" TYPE="text/css" rel="stylesheet">: でアクセスできたのが title="ooo" の部分
これを使って有効、無効を切り替えるとし・・・・なかなかうまい事いきまヘン
原点に帰って、インターネットで思いつくままのキーワードで検索
一般の人のページで、こうすればＩＥで切り替えが出来るはず・・という一文を発見
ただ、動作サンプルがなかったので出力して検討すると・・・やはり同じ考えで document.styleSheets からタイトルへアクセスしたはる
そのサンプルと今まで検討してきたスクリプトを比較検討し、何とか動作にこぎつけた～
今までの問題の中で一番時間がかかり、手を焼いた・・・まさか、一応得意としてる JavaScript でこんな事になろうとは・・・トホホ
今回の場合 出題者の意向とあってないような気がするが 少なくとも出題に対する回答の条件は満たしているはず これで落ちたら"引退"となりますわ
隠しページにリンクをはって・・・送信
蛇足：指定はＩＥ４～６なんですが、ＮＮ６でも動作しました・・これが良いのや悪いのやら
今回は、気になって 気になって 何度も回答を見て『これでいけてるやん！』と自分に言い聞かせた
恐る恐る見て ホッ！
正解者は４人か～ 意外と多かったな～ もちろんお馴染みさんだけ
解答を見ると 大筋で正解であった（自分では大正解だと思う）
今回の回答を作成する労力を考えると、これで十分である・・・・なんか敗戦の弁みたいやな
① 勝率を計算せよ！
勝ち負け表を作り、『Calk!』ボタンを押したら勝率を自動計算する
DOMを使って作りなさいか～ ここんとこDOMに手を出しているのが (JavaScript 参照）分かったはるような問題やな～
タグをゲットして、子を・・・・・document.getElementsByTagName("TR")・・・・空要素しか返しよらんがな～・・・・既に行きづまってますわ！しょうがないので、テーブルの各要素にＩＤを埋め込んで、それを参照するようにして、何とか動作（ダサいやり方ですな！）
関連している２問目 当然解けません・・・完全にギブアップ・・・で、あるプロに相談・・・ggetElementByTagName("TR").item(0)・・・というヒントを得る。もう一度考え直して何とか納得出来る解答になった・・・・・送信
② 表をソートせよ！
１問目に加えて、勝数、勝率のラジオボタンで、表の並べ替えをする。ただし、行要素を丸ごと入れ替える事
もう ボロボロ、締め切りも迫る！
とにかくタグ要素は取り出せるんだから、計算とDOMで、行がどう動くかとことん調べて、『行を移動させると、要素の番号がリセットされる。行を入れ替えると最下段に移動する。』事が解った。そこから、行を入れ替えたら、その行以外をもとの行に戻す作業をすると・・・・動いたがな～・・・・あれ！一旦行を動かすと、動作がおかしい？・・・計算通り動けへん？？？・・・・なぜ？なぜ？・・・う～ん・・・・時間切れ・・・・中途半端で、泣く泣く送信・・・・こりゃあきまへんわ。
敗戦の弁
今回、別人まで巻き込み、ご迷惑をおかけ致しました。
嫁さんにも 『こんな苦労することナラン!! 』とブレイク宣言され、且つ、先月号よりの力不足を痛感し、今回を以って終了させて頂きます。
戦 績
20戦全勝・・・過去知るところ、記録ナシ・・・これだけが勲章ですわ！
以下 次頁に続く・・・？？？？(NEXT PAGE)
| wheel | computer | other | illustration
| printer | profile | mail:mlango@mlango.com |
| JavaScript
| mad computer | omake | HTML TIPS & TRICKS | open remotecontrol |