php5.3でDeprecatedエラーに遭遇

xamppをアップグレードしたらphpが最新の5.3になっており、その環境でもともとあったアプリケーションを動かしたところ以下の警告が出ました。

Deprecated: Assigning the return value of new by reference is deprecated in C:\xampp\php\PEAR\HTML\QuickForm.php on line ***

このDeprecatedのメッセージは、将来のバージョンで動作しなくなる可能性があるコードがあると出るアラートメッセージだそうです。

Pear::DBとかPear::HTML_QuickFormみたいな古いライブラリは要注意ですね。それぞれ新しいバージョンが出てるので早めに移行しておいたほうが良さそうです。

とりあえず毎回アラートが表示されても困るので、php.iniのerror_reportingを以下のように変更しました。

error_reporting = E_ALL & ~E_NOTICE & ~E_DEPRECATED

MySQL5.5で文字化け(character-set-serverで解消)

クライアントマシンのmysql(xamppでインストールしたやつ)が、最近非常に調子が悪く、まともにinsertやupdateもできないような状態になってしまったので、xamppを入れ直すことにしました。

xamppの設定をするのは何年ぶりでしょうか。2年以上は間が空いてると思います。

とりあえずapacheやphpは大きな問題もなく移行が完了。
mysqlも普通に動いてる、、、と思いきや、phpからinsertをしたデータが文字化け起こしてました。

というわけで、my.cnfにお約束の文字化け回避設定をします。

[mysqld]
default-character-set = utf8
skip-character-set-client-handshake

が、mysqlが起動しなくなってしまいました。なぜ。。。

ググってみたところ、バージョン5.5以降では[mysqld]セクションのdefault-character-setが廃止され、代わりにcharacter-set-serverが追加されたそうです。

[mysqld]
character-set-server = utf8
skip-character-set-client-handshake

これで無事文字化け解消できました。ひとまず安心。

mysql5.5ではこの他にもいろいろ変更や新機能があるっぽいです。
今はまだローカルのテスト環境ですが、サーバー環境で使うとなると色々問題出てきそうですね。

table-layout:fixedでテーブルの列幅を固定する

ie7で、テーブルのセル幅指定が無視され、レイアウトが崩れてしまうという問題が起こりました。
どうやらie特有のバグみたいです。いつもながらieには本当に困らされます。

色々調べてみたところ、cssのtable-layout:fixedが使えそうなことが分かり、試してみました。

サンプル：table-layout:fixedでテーブルのセル幅を固定

table-layout:fixedを指定すると、最初の一行目でテーブルの列幅を固定するという働きをしてくれます。

さらに２行目以降のセルを描画する際に再計算をしなくなるので、ページの読み込みも早くなるようです。
ieのバグ回避以外でも使えそうだし、覚えておくとあとあと役に立ちそうなプロパティだと思います。

jqueryでアコーディオンメニューを自作する

司馬遼太郎を読むというサイトを運営してるんですが、各ページのコンテンツが非常に多く、縦に長いページになってしまっているので、アコーディオンメニューを導入してみました。

javascriptのアコーディオンメニューは探せばいくらでもあると思いますが、今回も勉強のために自作します。
というか、簡単なものであれば自作したほうが後々のメンテナンスが楽だと思います。

とりあえずググってこちらのページを見つけました。参考にさせていただきました。

http://coder.blog.uhuru.co.jp/js/easy_accordion

$('.accordion_head').click(function() {
$(this).next().slideToggle();
}).next().hide();

ソースはこんな感じ↑。非常にシンプルです。


これをベースに少し改良を加えてみました。

$('.accordion_head').click(function() {
$(this).siblings('.accordion_body:not(:animated)').slideToggle("normal",function(){ $(this).siblings('.accordion_head').toggleClass('accordion_head_opened'); });
}).siblings('.accordion_body').hide();

修正点は

・DOMの構造が違ったので、自分のサイト用にセレクタを修正
・アコーディオンが開いている時と閉じている時でそれぞれマイナスアイコンとプラスアイコンを表示
・アニメーションが終わったタイミングでマイナス/プラスアイコンの表示を切り替え
・「:not(:animated)」を加えることで多重アニメーション防止

といったところです。

実際に動いているものはこちらのページ等で確認できます。
http://shiba-ryo.net/contents/144/%E7%87%83%E3%81%88%E3%82%88%E5%89%A3

ちなみにこのページ、ブログパーツ等の読み込みに時間がかかります。
「$(document).ready(...」の中に処理を記述すると読み込みがすべて完了するまでアコーディオンが動かないので、コンテンツのすぐ後にスクリプトを設置しました。

サムネイル画像作成についてのメモ

ウェブサイト制作の仕事をしてると、サムネイルを扱うことがよくあります。
画像のサイズが全部揃っていれば問題ないのですが、縦長だったり横長だったり、様々なパターンがあるということがほとんどです。

基本的にはimgタグのwidth、heightや、cssを使って調整するのですが、きれいに見せるのはなかなか手間がかかります。

で、今回たまたまamazonを見ているときに気がついたのですが、amazonは全部縦揃え、つまりサムネイルの高さを揃えてるんですね。



まあ考えてみれば当たり前なんですが、高さが揃っていると全体的にすっきりまとまった印象を受けます。
ちなみにこれは画像を横並べにした場合です。

じゃあ縦並べの場合は、逆に横、幅を揃えてやればいいのかな、と思いますが、



画像サイズがわかりやすいように選択状態でスクリーンショットを取っています。
こちらも高さで揃えてますが、左右に余白を入れて画像サイズを揃え、中央寄せにしています。なるほど。

では楽天ではどうなのか。



細長い商品のサムネがどうなってるのか見たかったので、ラケットで検索してみました。
長辺を96pxにして縮小しているようです。

サイトの構成によって最適なサムネイルサイズは変ってくると思いますが、縦揃え・横揃え、余白ありなど、あらかじめ何種類か作っておけば完璧だと思いますが、とりあえず最低でも高さを揃えたものは作っておいたほうが良さそうな気がします。

WinSCPで特定のファイル、フォルダをアップロードから除外する

TortoiseSVNを使うと、バージョン管理しているフォルダにはもれなく「.svn」という隠しフォルダが作成され、中にはさまざまなファイル・フォルダ(バージョン管理情報でしょう)が入っています。

サーバーにファイルやフォルダをアップする際、いちいちこの.svnを避けてアップロードするのは非常に面倒です。困りました。

自分はファイル転送はWinSCPを使ってるのですが、自動で.svnフォルダをアップロードから除外できる方法はないかな～と思って探したら、設定画面でそれっぽい項目がありました。



↑のように、「除外する」「.svn/」にすれば、.svnフォルダ以下はすべてアップロードから除外されます。

あっさり悩みが解決。これでTortoiseSVNの利用がさらに進みそうです。

TortoiseSVNで個人のWindowsPCでもバージョン管理を導入

バージョン管理といえば、サーバーだとCVSとか、クライアントだとeclipseなどが定番で、自分も少しですが使用経験があります。

が、自分の場合、趣味でも仕事でもチーム開発というものをあまりしないので、基本的にバージョン管理はしていません。

が、個人レベルの開発でも「3日前に戻したい」とか「あの時に書いたソースって、もう上書きしちゃったよな。。」みたいなことがチラホラあるので、バージョン管理はできれば導入したいと思っていました。

が、いちいちサーバーの設定してクライアントも設定して、、、というのは面倒なので、結局何もしていませんでした。


今回、気まぐれで「バージョン管理 Windows 個人」みたいなキーワードでググっていたところ、こちらのページを見つけました。

TortoiseSVN でバージョン管理

なんだかよさげなので、インストールしてみました。

TortoiseSVNは、操作のほとんど(ほぼすべて？)はWindowsの右クリックメニューからできます。eclipseみたいに起動に時間がかかることもなく、快適です。

リポジトリの登録やコミットなど、基本的な操作は前述のページを参考にしつつ試してみましたが、なかなか良い感じ。これなら継続して使えそうな気がします。

まだ使い始めたばかりでわからないことだらけですが、使いながら徐々に覚えていこうと思います。