2006年05月10日

リンク先のサムネイルをポップアップ表示

Simple API - ウェブサイト・サムネイル化ツールというものを最近知った。

名前の通りシンプルに使うことができるようだ。
http://img.simpleapi.net/small/
の後にサムネイルを作りたい URL を記入するだけ。
Seesaa のトップページのサムネイルを作りたかったら http://img.simpleapi.net/small/https://blog.seesaa.jp/
とすれば画像が作成されるので img タグの src に指定すればサムネイルが表示できる。具体的にはこんな感じ。
<img src="http://img.simpleapi.net/small/https://blog.seesaa.jp/" title="Seesaa ブログ" />

とはいえ、自分で書いていくのも面倒なので JavaScript で自動的にできるようにしてみました。リンクされているテキストの上にカーソルを乗せるとサムネイルが表示されるようになっていると思います。環境にもよると思いますが。
(WindowsXP の IE6 Firefox1.5 Opera では確認していますが、それ以外はわかりません。エラーなどが出ていたら教えていただけるとありがたいです。)

あまり多くのものをサムネイル化するのも負担が掛かるようなので、メイン(このテンプレートでいうと id content 内)の中の五つだけをサムネイル化するようにしています。

サムネイルが表示されて何かいいことがあるのか、疑問もありますが、面白そうだったので作ってみました。他で同じようなものもありそうですが勉強ということで。

追記
ソースを公開してみました。ソースはこちらです。



posted by knit at 19:55 | Comment(0) | TrackBack(2) | JavaScript
この記事へのコメント
コメントを書く
お名前:

メールアドレス:

ホームページアドレス:

コメント:

この記事へのトラックバック

リンク先のサムネイル画像表示。
Excerpt: エプログ http://ablog.seesaa.net/ さんのお力をお借りして、 ちょっとデザインの手直しとかをしてみました。 &amp;nbsp; リンクURLをクリックすると、5つまでサムネイ..
Weblog: 700_news | ななひゃくにゅうす | やおよろずの少し手前。
Tracked: 2007-02-16 17:35

[Greasemonkey][Google]Googleウェブ履歴にサムネイルとfaviconを表示するGreasemonkeyスクリプト
Excerpt: // ==UserScript== // @name Show Thumbnail in Google History // @namespace http://d.hatena.ne.jp/noz..
Weblog: ヒビノキロク
Tracked: 2007-11-11 01:20