ウェブデザイナーの日記

あとから追記。2009年4月24日付。

今日知ったのですが、Slashdotに「ネットに蔓延するデタラメTIPS」なんてこの記事が紹介されてしまいました。それはどうもすません。ご指摘ありがとうございます。いまさら記事を消してもしょうがないので、間違い情報を流布した悪い見本としてこのエントリは置いておきます。

３年経ってもデタラメ情報を垂れ流しつづける有害サイトに注意

ブログの普及により、意図せず間違った情報が流れてしまうというのは現代の問題ですが、私はそれに対して明確な答えを持ちません。すまぬまぬこれから気をつけます。ほんとに！ゆるして！おねがい！という子供のような言い訳になってしまうので我ながら困る。今後精進して間違いの確率を減らすようにしていきたいです。いやほんと。

ところで今回 "Anonymous Coward" っていう言葉を初めて知ったのですが、正直いいまして「ガシガシと間違いを発見して世直しをしていきたいのだ〜」という威勢のよい記事を書いているひとがCowardかよ！と思ってしまいました。Cowardに怒られてじつに情けない私というきもちにさせる心理作戦でしょうか。"Anonymous Cowardていう言葉の語源などを知らないのでわかりませんが、なにかシャレがあってそう命名してるかもしれませんが、内容的にいって "Justice League" くらい名乗ってほしいもんだと思いました。

追記以上。

画像ファイルをプリロードしたいときがよくあります。プリロードっていうのは、つまり、htmlページがブラウザのキャッシュに読み込まれた時点でいっしょに読み込ませたいという意味です。オンマウスオーバーの代替画像とか。たいていはjavascriptでやるものでしょうが、かんたんなものなら、cssの方がお手軽です。プリロードしたい画像を次のようにcssで読み込ませちゃいましょう。

#image-preload{
width: 0px;
height: 0px;
display: inline;
background-image:url('画像へのurl');
background-image:url('画像へのurl');
background-image:url('画像へのurl');
}

画像はいくつでもオッケー。1行づつbackground-imageとして記述しましょう。んでもって、bodyのどこか、私はアクセス解析のタグの下なんかによく入れますが、どこでもよいのでこれを記述↓

<div id="image-preload"></div>

これでプリロードされる。ちょっとべんりだと思いませんか？ついでに書いとくと、オンマウスオーバーのリンクボタンをやりたかったら、このようにhtmlに書いとけばオッケーですね↓

<a herf="リンク先url"><img src="画像へのurl" onmouseover="this.src='代替画像へのurl'" onmouseout="this.src='画像へのurl'" /></a>

と書いといて、代替画像を上のやり方でプリロードさせる。という風にすれば、いちいちjavascriptの外部ファイルを書いたりしなくてもサクッとできるので、ちょびっとやりたいときなんかにはこっちの方がお手軽です。

ところで、マウスオンオーバーなんだか、オンマウスオーバーなんだか、どっちだったかいつもわからなくなります。これってトシ？

『css』カテゴリのエントリ

• cssファイルにphpを記述するという技法（未検証）
• CSS :: height:1pxのボックス要素をつくるには
• CSS :: Nifty Corners :: 画像を使わずラウンドコーナーしたい
• CSS :: font-sizeについて考えよう

コメント・プリーズ！

お名前 (your name)

(required)

url

(optional) ※公開されます。

メールアドレス (email)

(optional) ※公開されません。管理者にだけわかります。

コメント (comment)

(required)

 クッキーにお名前、url、メールアドレスを保存する。

※クッキーに保存すると次回から入力を省略できるので便利ですが、お使いのコンピュータに情報が残りますので、公共のパソコンなどからアクセスするような場合はチェックをはずしたほうがよいでしょう。

※コメント中のhtmlタグは実体参照に変換されます。たとえば、『<』は『&lt;』というかんじになりますのでhtmlタグをそのまま書き込んでくださってオッケーです。

ADD YOUR COMMENT! / コメントする