2010年5月 Archive

ジャンプページのソース コピペ用

<html> <head> <title></title> <meta http-equiv="Content-Type" content="text/html; charset=shift-jis"> <meta http-equiv="refresh" content="0;url=http://www.inclover-inc.com"> <body> <script> location.replace('http://www.inclover-inc.com'); </script> </body> </html>

IE6でselectタグ(プルダウン)がz-indexを無視するのでdialogよりも前面に出てくる件について

IE6でselectタグ(プルダウン)がz-indexを無視するのでdialogよりも前面に出てくる件について

dialogをクリックしたときに、同時にselectを消す?
じゃぁdialogがひっこんだときにselect復元させんの?
そんな面倒むりです。。。

iframeを重ねればいいそうで、

対策は、昔からいろいろ出ています。
IE6でselectタグ (プルダウン)がz-indexを無視する対策

jquery版もあります。
jquery.bgiframe(IE6で他の要素と重なっているselect要素を隠す)

最近のjqueryのlightboxやJKL.Calendarなどは、これらもちゃんと対応してくれているので、安心して使えるというわけです^^
いやぁ、すばらしい。。。

つい最近まで、
「IE6でselectタグ(プルダウン)がz-indexを無視」するのが常識なんてことも、意識してなかったですから・・・。

htmlをメールに添付すると危険です

<!-- saved from url=(0022)http://internet.e-mail -->

Outlookだけでしょうか?

メールにhtmlファイルをそのまま添付すると、
上部に↑こういうソースが勝手に埋め込まれるんです。

コメントアウトタグなんで、
悪させずにただ隠れてくれてるなら別にいいんですが、

これもまたIEだけ、
スタイルシートの一部の文字サイズが適用されなくなって、
レイアウトがすっごく崩れるんです┐(・ε・`)┌


あれ?と思ってwinmergeしても、
上部過ぎて気づかないから、とんだ迷惑ものです。←気づかないのは自分のせいなんだけど!!w

クライアントにhtmlをぽーんっと送るとき
メールでぽーんとhtmlをもらう際には、気をつけましょう。

一番いいのは、zipなど圧縮して送ること。

IETesterの最新版を使いましょうね

IETesterが、Version 0.4.3にバージョンアップされてました。

私、今日まで0.3.xとか超旧式使ってました。
こういうのは、こまめにバージョンチェックした方がいいですよね。

複数タブを開いてて、みんなF5再読み込みしまくっていると、
全部遅くてすごいストレスだったり・・・
あの時間があほみたいです。

最近では、ie8タブを開くと、デフォルトのTOPで毎回jsエラーとか出て、
おいおい、あなたがセレクトしたHOMEでしょ!
と、ツッコんでたんですが・・・恥ずかしい。

IE9をプレビューしたいなと興味本位でもあったんですが、
残念ながら、
IE9 previewはVista SP2かWindows7で動作するらしく、
XPはお呼びでなかったです_| ̄|○

しかも、vistaや7の人も、手動でファイルをコピーする必要があるそうですよ。

画像サイズを大きさによって自動リサイズ表示js

CMSとか組んでいると、
記事に登録している画像の大きさによって、
表示時にリサイズしたり、
サムネイル生成して表示したり、
色々システム側の処理って必要ですよね。

150pxの画像も1200pxの画像も、
実寸表示させちゃったらサイトのレイアウト壊れるし、
一律500px表示しちゃったら、150pxの画像は変に拡大されてぼやけて迷惑です。

サーバにimagemagickがあれば、
システム側で処理するのが、通常だと思います。
でも、HTML側で出来る処理ってあります。

そもそも、IEは7以上、Firefoxとか新しいブラウザが対象なら、
スタイルシートで
max-widthとかmax-heightとか指定したらいいんですけど。

まだまだ、max-widthとかmax-heightが使えないIE6が幅を利かせているので、
むやみに使ったところで悲しくなるだけ。クレームと修正作業のもとです。

そこで、

・300px以上の画像は、300pxに縮小表示 ・300px未満の画像は、実寸(250pxとか100pxとか)のまま表示

という優れものjavascriptを使ってみましょう。
(もちろんカスタムして、幅は自由に設定してください。)

これで、最新のスタイルシートの技を盾にぼやく必要がなくなります。

▼サンプル
画像サイズを大きさによって自動リサイズ表示js

センスのないネーミングでスミマセン。。。

aaを超える!?cssアート

HTML とCSSだけで実装する、ごく普通のアイコン

ちょっと↑見に行ってみてください。

マウスオーバーでズームできたりして、
「え!?画像じゃないの!?」

右クリックとかソースみてimgタグ探したりしちゃいます。
まじスゴイです。

ただし、HTMLソースもcssも長いので、
ブログやページに使ったりできるのか?って言ったら話は別。
実用性はあんまない気がします^^

究極は、
画像を一切使わずにCSS3だけでドラえもんを描いてみた!
っていう展開もありますw

サンプルページ

スゴすぎます。(IEが仲間割れしてますしw)

ていうか、流行ってるんですかね。

アスキーアート(aa)とかもいつも関心するんですが、
cssを知ってる人ならこっちもかなり関心しますよね。

1