au携帯端末でselect内の文字が改行されてしまう件
モバイルサイトを作って、
自分のau端末（W52SA）で確認したところ、select内の文字が改行されてしまい非常に残念なカタチになってしまう現象に遭遇。
styleでwidth指定しても意味なし。
涙目になりそうなので、早々にググッてみると結構出てくるｗ
モバイルサイトform、select欄の文字を改行させない方法比較カスタマイズブログ
AUの携帯端末でselect 内が改行される - bushimichiの日記
これらによるとフォントサイズを小さくしていると、selectボックスの大きさもそれに影響されてしまうとのこと。
なのでselectの部分だけ、フォントサイズを指定しない（または”medium”に設定する）ことで解決。
jqueryUI accordion と -moz-box-sizing: border-box; の罠
手持ちのプロジェクトにjquery UI の accordionを使ってみようと思い実装してみた。
が、なぜかアコーディオンが開くアニメーションのときに横幅がboxの内側にズレて凹んだ形で開いてしまう。
開閉のアニメーションが終わると正しい横幅に直るのだが、今度は高さが短くスクロールバーが表示されてしまう現象が発生。
ブラウザはFireFox3。
ためしにjqueryUIのデモと同じソースをコピって動かしても同じ現象になる。
ということはcssかと思って、デザイナが作ったcssをず〜っと追ってみるとどうも
* {-moz-box-sizing: border-box;}という部分が影響しているようだ。
これをはずすとうまく動く。
この-moz-box-sizingは、ブラウザごとに異なるwidth,heightの算出結果の差分を調整するためのプロパティのようだ。
デザイナに問い合わせてみるが、これを取り去ってしまうとこれまでのデザインがすべて崩れるのでダメと言われてしまった。
仕方ないので試行錯誤してみる。
するとaccordion内コンテンツ部分のdivにインラインで
<div style="-moz-box-sizing: content-box">〜</div>
としたら、現象が治まったのでとりあえずだがこれで様子を見ようと思う。
こんな感じ。
<div> <div id="accordion"> <h3><a href="#">Section 1</a></h3> <div style="-moz-box-sizing: content-box"> <p>ああああああああああああああああああああああ</p> </div> <h3><a href="#">Section 2</a></h3> <div style="-moz-box-sizing: content-box"> <p>いいいいいいいいいいいいいいいいいいいいいい</p> </div> <h3><a href="#">Section 3</a></h3> <div style="-moz-box-sizing: content-box"> <p>うううううううううううううううううううううう</p> </div> <h3><a href="#">Section 4</a></h3> <div style="-moz-box-sizing: content-box"> <p>ええええええええええええええええええええええ</p> </div> </div> </div>
object2array
simplexml_load_stringで読み込んだXMLを配列に変換したくなった為作成
public function object2array($object)
{
$object = (is_object($object)) ? get_object_vars($object) : $object;
$array = array();
foreach ($object as $key => $val)
{
if (is_object($val) === true || is_array($val) === true)
{
$array[$key] = $this->object2array($val);
}
else
{
$array[$key] = $val;
}
}
return $array;
}
ただ、このコードでは要素が単数だった場合に、複数ある場合より出来上がった配列の階層が１段下がってしまう問題がある。。。
ブラッシュアップする必要あり。
PDT 2.0公開
ITpro - Eclipse，PHP開発者向けツールの新版「PDT 2.0」を公開
http://itpro.nikkeibp.co.jp/article/NEWS/20090122/323226/
PDTダウンロードページ
http://www.eclipse.org/pdt/downloads/
Flex開発環境構築メモ
Flex Builder（eclipseプラグイン版）
既存のeclipse環境にFlex開発に必要なものをプラグインとして組み込む。
どちらも製品版は有料（3万くらい）。
2ヶ月の試用期間がついている体験版があるので今回はプラグイン版を使ってみる。
すでにPDTがあったが、今回はFlex用に新しくeclipseを用意してみた。
参考：
インストール中にいろいろ問題があったが、こちらのページに適切な答えが書いてあったので非常に助かった。
Flex3無償体験版（要AdobeID）
http://www.adobe.com/jp/products/flex/
サインイン直後のページはスタンドアロン版のダウンロード画面なので、画面中ほどにあるリンク（”ここをクリック”ての）からプラグイン版のページへ移動し、そこでプラグイン版をダウンロード。
あとはダウンロードしたファイルをダブルクリックして、ウィザードにしたがってインストール。完了。
つつましいJavaScriptで幸せになろう
最近時間に余裕ができてきたので、けっこう前に購入しておいて全部読めてなかった
標準DOMスクリプティング JavaScript＋DOMによるWebアプリデザインの基礎
を最初から一気に読みなおしてみた。
久しぶりにここに書き残しておきたいネタがあったのでエントリ
この書籍ではDOMスクリプティングの基本から、HTMLの操作、CSS、イベント処理というように順を追って解説されており、段階的に学習していける内容となっている。
DOM入門者はもちろん、DHTMLをやったことあるけどDOMとどう違うのとお思いの方にも有効な内容である。
webの歴史の中でいまだ無くなることのないクロスブラウザの対策についても、具体的かつ実践的なサンプルとともに丁寧に解説されているのがありがたい。
この本が発行されたのが2007年初めであるが、2年たった今でも書かれている内容は色褪せていない、すばらしい！
さて、
ここでまとめておきたいのはこの本の第6章に書かれている。
この章に書かれていることこそ、web製作に関わる者なら頭に入れておくべき事柄なのではなかろうか。
前半にて「Javascriptはつつましくあれ」と題し具体的にその内容を説明しているので簡潔にまとめてみる。
アノブトゥルーシブ・スクリプティング（Unobtrusive Scripting）
つつましいスクリプティングのこと。
執拗に実行させようとしない、引き際が肝心。
次の２つの目標がある。
・階層の完全分離
ひとつのページは構造（HTML）、表現（CSS）、動作（JavaScript)に分けられるべき。
もし１つのファイルに構造、表現、動作が混在しているとメンテナンス性が悪い。
・動作環境確認
アクセス元は必ずしも最新のブラウザではなく、古いブラウザやテキストブラウザ、Javascriptをオフにしている、ロボットの場合もある。Javascriptが実行できないなら、そのページで伝えるべき内容は確実に出力しつつ、コードの実行はきれいに終了する。
プログレッシブ・エンハンスメント（Progressive enhancement）
アノブトゥルーシブ・スクリプティングの概念を集約したもの。
コンテンツが主役、Javascriptは脇役に徹するという概念。
つまり、コンテンツ（HTML）だけで目的を達成することができて、Javascriptはそれに便利な機能を付加するものである。
それがSEO対策にもなる。
グレイスフル・デグラデーション（Graceful Degradation）
プログレッシブ・エンハンスメントを活用し、貧弱なエージェントでも目的を達成できるようにすること。
フォールト・トレランスの概念に似ている。
オブジェクト検知
DOMのインターフェースはすべてオブジェクトなのでオブジェクトを検知する。
なのでDOMに準拠しているか判断するのにエージェントを見る必要はない。
後半は「ロボットに優しいHTMLを目指して」と題して、バックリンクやセレクトリンク、画像ポップアップといった良く実装される機能を題材に、アノブトゥルーシブ・スクリプティングの実践方法を解説しています。
この第6章の内容だけでも非常に刺激的で読む価値は十二分にあると思いました。
なんでもっと早く読まなかったんだと、自分を罵るくらいにｗ
すべてのプログラマ、デザイナー、コーダーがつつましいスクリプティングを実践できればきっともっとみんな幸せになれるかもね。
memcached＋repcachedを使ってみる
memcachedは高速で便利なんだけど、サーバー間で同期できないという難点があります。が、それを解消する「repcached」というすばらしいものがありました。
lab.klab.org - repcachedで提供されています。
インストールの方法は、memcachedを入れてパッチを当てる方法もありますが、すでにパッチの当ててあるものがありますので今回こちらを入れてみます。
memcachedを使うにはlibevent-develが必要なのでまずそれを入れておく。
# yum install libevent-devel
repcacheのインストール
$ wget http://downloads.sourceforge.net/repcached/memcached-1.2.5-repcached-2.0.tar.gz $ tar zxvf memcached-1.2.5-repcached-2.0.tar.gz $ cd memcached-1.2.5-repcached-2.0 $ ./configure --enable-replication $ make $ sudo make install
もうひとつのサーバも同様にインストールします。
接続も出来、ちゃんとレプリケーションも出来ることを確認。
さて、sfMemcachePluginを使ってみるCommentsで実装したsfMemcachePluginからどのように使うのかなぁ。
