IE7.js利用の注意点

インターネットエクスプローラーのバージョンによってCSSの変更とかって
すごく面倒なので、最近はもっぱらIE7.jsを利用させてもらっている
IE5だのIE6だのの古いブラウザのバージョンでも
IE7のCSSの扱いと同じように表示させることが出来るので便利なのだが
あくまでも似せることが出来るというだけで
100％同じというわけではないようで、ちょっと気付いた点をメモ

IE6だと透過PNGを背景画像に使った場合、画像上のリンクが効かないという点で
IE7だと背景にPNGを使ってもOK

あとはリンク表示の設定で
　a:visited
　a:hover　等があるが
この指定の順番で
　a:hover
　a:visited　の順に指定すると
一度訪れた（visited後）状態のリンクにhoverが効かなくなる
これはIE7.jsに限ったことではないかもしれませんね
hoverが効かなくて、う〜んなんでだろう・・　と悩んだので
初歩的なことかもしれないけれど、自分へのメモということで

IE7.jsを使ってみた

そろそろIE7向けのWeb制作に切り替えていこうかと考え
前から試してみたかったIE7.jsを利用してみた
とりあえず透過PNGを試してみたかったので
透過PNGを用意してテストページをアップしてみたのだが
これがなぜか透過にならない
googleのテストページではきちんと透過されているにになぜだ？！
散々調べた
画像の書き出し方がまずいのだろうか？！
アルファチャンネル？
しかし、どうやっても透過されずにいた・・・
もしかして透過されないんじゃないの？
と思っていた時、とあるページで透過PNGにする時は
画像の名前に-transを付ければ透過されるとの記載を発見！
（例　画像名-trans.png）
よくよくgoogleのページのPNGの説明をみると
きちんと書かれているではないか・・・
英語のページだからと鼻っから読まずにいるのは問題だな・・・
と、反省させられた瞬間でもあった

IE7の自動配信迫る？！

この前、ie7.jsというものの存在を知って
ぜひとも試してみたいと思っていたのだが
自動更新によるIE７のアップデートが２月１３日にありそう？との記事を発見
ということはあと半月あまりで一斉にIE7に切り替わるわけで・・・

まあ、更新する人のパーセンテージはわからないけど
ほんと一気にIE6とIE7のユーザー数が逆転する可能性すらあるわけで
それなら、今更わざわざIE6のために無駄な労力を使わずに
IE7をメイン（本当はWeb標準ブラウザがメイン）に制作し
そっからIE６の利用者への対策でIE7.jsを使うってのがいいのかな〜なんて思う
RSSにも対応しているし、透過PNGも使えるし
かなりHPのデザインなり機能？が変わってきそうな予感？

すでにIE８の開発が進んでいるらしいが
きっちりWeb標準にあわせてくれていればいいのだが・・・

心が「・・・」

テンプレートで「lightbox」というAjaxのライブラリを使って
サムネイル画像をクリックすると拡大表示する際にエフェクトみたいなのが
かかるようにしてみたのだが
lightboxというクラス付けするだけでいいのだが
その使い方はあまり知られていないようで・・・

まあ、みんながみんなHTMLがわかるわけないし
手間がかかるので仕方ないな〜と思いつつ
jQueryというライブラリを使えば、手動でクラス付けしなくても
自動で出来るようになるかも！？
ということを本で知って、さっそく試してみた

で、自動に出来るには出来るのだが
そこで使われているthickboxというやつが
lightboxのエフェクトよりも簡素化された感じだし
プログラムどうしで、どこかが干渉しあってるのか
＃をつけたアドレスに飛ばないようになったりして
なかなか上手い具合に動いてはくれない・・・

HTMLやCSSだと、見た目でどのへんが悪いのか判別出来るのだが
制御のほうだとそれがわからないから苦手・・・
とりあえず学ぶ事が、また一つ増えたわけだ

色々とあれこれ試しているうちに、テンプレートのミスを見つけてしまった・・
記事下の「トップへ戻る」ってとこクリックしてもトップに戻らないとかね・・
他にも発見してしまったので、後で直さないと・・・

画像表示のエフェクト

lightboxというAjaxライブラリがある
写真をクリックすると背景が暗くなって、拡大された写真が表示される
yahooだとかで画像検索したりする時と同じ？ような感じなので
見たことある人も多いはず
で、ブログで写真を紹介している方も多いので
テンプレートでこれを使えないものかと思ったのですが
ちょっと難しそうだ・・・

とりあえず、記事内で使用する画像のアドレスの後に
下の赤い文字の部分を足すだけで済むのだが

a href="FC2ブログ/file/画像.jpg" rel="lightbox"

ただ、画像を使用するたびに手動でするのはどうだろうか？・・
でも、足さなくても今まで通りの表示されるわけだし
記事部分の枠のサイズを無視して
大きめな画像を表示出来るという利点はあるので
そこが、悩みどころ・・・




ダウンロード先
http://www.huddletogether.com/projects/lightbox2/