JavaScript Archive

8月27〜28日の48時間でnode.jsを使って制作する大会？に参加しました。

作品の内容はリアルタイムで複数人が演奏するというもので、メンバーはプログラマー3名とデザイナー1名（自分）で先輩の家に泊まり込んで2日間ぶっ通しでデザインやら開発を行ったんですが、結果完成せずでした。。。

ただその限られた時間の中で自分はデザイナーとして、みんなの認識を合わせつつワイヤーを組んでデザインしてマークアップをしました。対象ブラウザをchromeのみにしたことで、HTML5やCSS3も積極的に取り入れられたので勉強になりました。

今回は残念でしたがまた来年挑戦できたら良いなぁと思います。

日の目を見なかったデザイン。。。

また他のチームの作品を見ることができるので次回の参考にでもしようかなと思います↓
http://nodeknockout.com/

最近よく耳にするので簡単ですが実装してみました。
現在はwordpressのプラグインであるWPtouchでスマホ対応は任せっきりなのでプラグインを使わずにできたらなと。

現在　※WPtouch使用時

jQuery Mobile適用

左側のメニュー部分を行ったのですが、下記だけでこの表示になります。

<ul data-role="listview" data-inset="true" data-theme="c" data-dividertheme="b"> 
	<li data-role="list-divider">カテゴリー</li> 
	<li><a href="">CSS</a></li> 
	<li><a href="">Design</a></li> 
	<li><a href="">Flash</a></li> 
	<li><a href="">HTML・XHTML</a></li> 
</ul> 

うーん素敵過ぎます。現在test環境でリニューアル準備中なので、その際はがっつりと使用したいと思います。

先日、フォトギャラリー風なページを作成してブラウザチェックを行っていたときに、IEのみ画像が透過になった現象が起きました。

最初はモニターが壊れたのかと思ったのですが、どうやら「filter:alpha(opacity);」を使用すると、画像内の#02050aが使用されている箇所が表示されなくなるバグみたいです。解決方法はpngで書き出す、#02050aを使用しない、画像背景にうまいこと#02050aを指定するみたいなことが考えられました。

この中で選んだ作業は#02050aを使用しないということだったのですが、これがまた大変な作業でした。photoshopを使用して、使用している画像を一つ一つチェック、修正の繰り返しで…画像が100枚強あったので途中何度も萎えましたが何とか終わらせることができました。本当ならばpngで処理したかったですが。

偶然出くわしたバグなのですが、とてもいい勉強になりました。