職業訓練の授業中こそこそやりました。『実践Ajax』でprototype.js+Script.aculo.usのUIエフェクトを紹介していたんで作ってみました。これです。
昨日「jQuery可愛いよ」ばかり書いてて、prototype.js様の罰が当たるかと思ってやりました。やっぱりすごいprototype.js。エフェクトサンプルの部分は僕みたいなやつでも1時間もかからず組めました。まぁいつも通りJSON部分で試行錯誤。家帰ってきて今までかかったわけですが。でも、おかげでCatDogViewerとちがい写真にちゃんとリンク張れました。CatDogViewerの方もそこらへんちゃんとしたいんだけど、やりかたがまだ分からない。HTMLの勉強もっとしよう。
こんな演習、勉強というより遊び(それも小学生レベル)だから、スキルアップにつながるかは疑問だし、僕が本当にウェブ構築スキルを身につけてやりたいこととは全く関係ないのだけど、今の僕の能力だとこの程度のことが出来るだけでもすごくうれしいし楽しいです。それと、いわゆる「ウェブ制作会社」とかだとスクリプトでこういう「見た目」に効くスキルが求められるのかなとも思ってる。僕絵心全くないんだけどね。
以上。って閉めようと思ったらChromeでは全く動かないことが判明。じゃあ公開やめろよ。いやだ。
10年10月28日(木)‡01時14分32秒 ‡
Script
職業訓練が今日も自習状態だったんで、そうはいってもJavaScriptの時間なので一応遠慮してCatDogViewerをあれこれいじってました。前に書いたとおり、(というか最初から)imgタグのinnerHTMLがタイミング良く受け渡しされないんで苦労してましたが、3行入れ替えるだけで懸案だった「Chromeでも動くようにする」「alertを出さなくて良いようにする(出さないとobject内容が引き渡せない)」が直りました。比較のために前のと今回のを置いときます。レベルの低い話を偉そうに言って申し訳ないですが、以下改良できた経緯です。
授業で「prototype.jsでJSON処理」つーのをやったので、CatDogViewerの隠れた問題「Prototype.jsとjQueryの共存」を解消できないかなと思い、あれこれいじくったのですがいつも通り挫折。わかったことはJSONとJSONPって違うのね、ってことぐらい。
で、「俺にはやっぱりjQueryしかない」「jQuery可愛いよ」とgetJSON関数のリファレンス覗いてたら、「コールバック関数」って言葉が出てきた。あー聞いたことある。「初めてのJavaScript」でよくわかんなかったとこだー、なんて思ってたら、説明に「処理が完了したら実行される関数」なんて書いてある。あれ?
よく自分で書いた(コピペした)コード見てみたら当たり前だけどちゃんとそういう構造になってる。で、3行getJSON関数の引数として移動したら出来ちゃった。
データがスムーズに受け渡されないことが諸悪の根源。alert入れて一旦処理を抜けると(一応)動くことからそう考えていましたが、逆に「受け渡しできてから次の処理」ってやれば良かったのね。俺の馬鹿。
その結果alertなし・chromeで動く、には出来たんだけど、今度はimgの中身が間に合わなくてみっともない状態になっていたので、上記と同じ考え方「中身が入ってから表示する」にコードを変更して完成。ここでもjQueryの「event.add(とonload)」構文を使いました。ホント可愛いよjQuery。なお、readyメソッドでは駄目でした。判定基準が違うみたい。
以上が今日の進展です。じゃあこれでこのスクリプトの改良は終わりかということ。いえいえ。機能を増やす予定は元々ありませんので使い勝手の向上を追求していくことになるのですが、早速気になる点が。というか今回解消できた問題点が無くなったら気になるだろうなと思っていた点、「初回以降にボタンを押したとき、ぱっと画像が消える」というのがやはりみっともないなと思ってます。他の画面変更は皆slideup・downで行っているのに、この時だけぱっと消えちゃう。今まではalertでごまかされてました。以下改良失敗覚え書き。
- スクリプトの最初にslideupを入れた→slideupの前にinnerHTML=””が効いちゃって、結局ぱっと消える。Ajaxの馬鹿。
- この場合のonloadやreadyの入れ方が分からない。
- setIntervalで判定ループ(slideupが終わったらinnerHTMLをクリア)は何故か駄目。
までで今日は挫折。以上です。何か昨日から挫折って言葉をいっぱい書いてる感じ。
今から勉強の方を頑張ります。ああ、PHPは可愛くないなー。
追伸:IE9で見てみたらぜんぜん駄目だった。これは正式版出てから対応します。つーか出来るのか?
10年10月26日(火)‡19時07分15秒 ‡
未分類
今日は職業訓練が一日自習だったので勉強が大分捗った。web構築スキルの「勉強」ってのも変な話だけど、本をじっくり読んで「勉強する」ってことは今しかできないかなって思ってるのと、資格試験が近いため「勉強」してるんです。ええ、あの悪評高い「ウェブデザイン技能検定」受けます。ええ。2級です。すみません。この話はまたの機会に。
というわけで時間が出来たので皆さんお待ちかねの学習の記録第二弾。PHP(地獄)編です。ええ、分かってます。誰も見てません。アクセスログ見てますから。
- ノン・プログラマのためのPHP入門 10日間コース
JS編で書いたとおり、PHPの学習にはすごく苦労してます。この本に最初に取りかかったのは「持ってたから」。去年前職がちょっと暇だったときに少しでも勉強しようかと思い買いました。けど積ん読。「ノンプログラマ」とはありますが、「素人向け」という内容ではないよう。(僕ちょっと疲れてるのかな)。webデザイナーなど、「触れたことはある」程度の知識は事前に必要ではないかと思います。はい言い訳です。で、用語の分からないものが多く、3章で挫折。ただし、この本にものすごく感謝してるのはXamppの導入を助けてくれたこと。おかげさまで最初の学習環境を整えることに労力をとられないで済みました。僕の場合は本の通りやって一発で上手く行きました。まぁ後で人並みに苦労はするんですが。
- 初めてのPHP5
次はこれ。迷いに迷ってこれを買いました。JS編で触れた『初めてのJavaScript 第2版』より先に始めて6章で挫折。詳細な説明で勉強の充実感はあるんですが、知らない言葉が多すぎて本当に頭がパンクしそうになりました。1ページ/日がデフォになってきたんで一旦撤退しました。
- 基礎からのMySQL
ネットで(泣きながら)探しまくって、藁にもすがる思いで次に買ったのがこの本。どこでも絶賛されてる感じなのですが、僕にもこの本はよく理解できました。というかこの本で駄目ならサーバサイドは一旦諦めようと思って始めたので、西沢先生(勝手に呼ばせてもらってます。)には足を向けて寝られません。2章の扉に書かれてらっしゃる「必ず成功する秘訣」を何回も読み返しながら勉強しました。で、嬉しくて調子に乗って掲示板を公開してます。理解し易くて読んでて気持ちが良いので暇があれば読み返してますが、やっぱり分かってない部分も多くてまだまだお世話になりそうです。
以上が勉強のために買った本です。今は『初めてのPHP5』に再挑戦中。今日は9章がようやく終わりました。頭痛が酷い。2度目の挫折間近。明後日から一旦『独習PHP 第2版』に行く予定です。
他にも評判が良かったので『PHPによるWebアプリケーションスーパーサンプル 第2版』も買いました。でも今の僕のレベルでは意味が分からなすぎてただのカーゴカルトコーディング(こんな言葉あったのね)になっちゃうんで、眺めるだけに止めてます。もう少し理解が進んだらもう「勉強」ではなくて「実習」を始めるつもりなんで、その時は大活躍してくれそうです。いつのことやら。
以上、PHP編でした。JSの方は順調に『JS5』に進んでいて今日は5章まで進みました。意外に分かり易いです。
10年10月25日(月)‡21時58分00秒 ‡
未分類