CSS3のソースコードをパパッと出力するジェネレータを作った。
巷には既に超有名ジェネレーターが２つ３つあるんだけど、
ボタンのマウスオーバーとかグラデーションで作るときもプレビュー出来るやつが欲しかったんで、
無いなら作ればいいじゃない理論で擬似クラスにも地味に対応してます。
使い方は右上のHelpにちらっと書いてあるんだけど多分初見で使えると思う。
あんまりテストしてないのでバグとかリクエストとかあったらtwitterとかこの記事のコメントとかメールとかで教えて頂けると助かります。
未圧縮ソースはリポジトリに。
続きを読む CSS3 Code Generator
締切後のソース公開OKらしいんで晒しておきます。
応募用デザインにキュンとしたので、思い立ったが吉日な勢いでコーディング。
連休中のいい暇つぶしになりました。
イベント自体は前々から知ってたんだけど、腰が重くてなかなか手を出さず…実質的な製作期間は４日くらい。
例によってMooToolsをしこたま多用してます。
ボタンにはCSS3のtransitionとグラデーションをフル活用してます。
このプロパティ面白いんだけど手打ちは地獄を見れるぜ…！
transition.cssのカオスさは必見かもしれない。
一応IE6とかでも同じように見れるようにはしてあります。なんかもう癖みたいなもんで。
続きを読む [HTML5+CSS3] 第二回コーディングコンテスト に参加してました
ちょっとPerlが必要になったので、Hellow worldからの過程をメモることにします。
このエントリーの最終目標は、[Ajax + PHP] Web2.0的にHTMLソースを隠す方法 で晒した Request.phpでやってることで、
です。
Perlが使えるとさくらインターネットのライトプランみたいなPerlのCGIしか許可されてない鯖で強い。
安価な鯖だとPHPダメって所は多いです。
現時点での自分の状況を書くと…
設置は経験あるけど作ったことはないっていう状況。
自分の中で消化する為にPHPと比較しながら覚える手を使ってます。
ZeroMail作り始めた時もこんなんでしたわ。
PerlはDreamweaverでサポートされてないので、テキストエディタMeryを使用した。
Exchangeに何かあるかと思ったけどさっぱりだった。
ローカル環境はXAMPPです。パスはxamppデフォルトそのまんまで、文字コードはUTF-8。
#!/xampp/perl/bin/perl print "Content-type: text/html; charset=UTF-8\n\n"; print "Hello world!!\n";
拡張子cgiのファイル作って上のソースコピペしてブラウザで開けばHello worldが出力されるのだが、
content-typeが無いとmalformed header from script. Bad header云々のエラーが出る。
文字コードの扱いに関してはPHPよりも厳しいんだよな、確か。
質問サイト見てたら面白いネタを発見！
私は今、長編小説をHPに公開しようと思っています。
キャラクター紹介のページを作ろうと思っているのですが、
読んだ読者さんによって表示される内容を変えたいのです。
例えば第一章で登場するAとBというキャラがいたとします。
読者さんが第一章を読んだらキャラ紹介のページにAとBのキャラクターの紹介が加わる。
という形にしたくて、cookieを使用しようと思うのですが、
なにぶんこのような操作ははじめてでしてどうしたらよいのかわかりません。
各章の最後のページにクッキーを食べさせるjavascriptを書いて、
キャラ紹介のページでクッキーを読み込み、キャラの説明文を表示したいです。物語が進むにつれて、他キャラが増えたり、説明文に追記が加わるようにするにはどうしたら良いでしょう。
cookie使用があまりなく、調べましたがよくわかりませんでしたので詳しく教えていただけましたら幸いです。
独自CGI作ってもよさげな発想だと思ったんだけど、PHPとJavaScript使えば比較的簡単に出来るので、
デモとサンプルソース晒しときます。
トップは1.htmlでもindex.htmでも何でもいいですが、
2ページ目より後のページを 番号＋拡張子 にします。
ロールオーバースクリプト（画像名のOn/Offで判別）とマウスオーバーでリンク画像の透明度とか変更を足してクラスにしてみた。
指定エリア以下のaタグ拾ってマウスイベントでロールオーバーする。
画像名に指定した文字列があれば置換、なければ透過処理。
ロールオーバーさせない指定はclass名の有無（imgタグ内）で判断する。