Home > スポンサー広告 > ウェブページにある画像と背景画像を表示するブックマークレット (3)

スポンサーサイト

スポンサー広告

上記の広告は1ヶ月以上更新のないブログに表示されています。
新しい記事を書く事で広告が消せます。

Comments:-

Comment Form

Trackback+Pingback:-

TrackBack URL for this entry
http://karafuto50.blog117.fc2.com/tb.php/185-dd1aa378
Listed below are links to weblogs that reference
スポンサーサイト from Karafuto Blog

Home > スポンサー広告 > ウェブページにある画像と背景画像を表示するブックマークレット (3)

Home > javascript > ウェブページにある画像と背景画像を表示するブックマークレット (3)

ウェブページにある画像と背景画像を表示するブックマークレット (3)

javascript

ウェブページにある画像と背景画像を表示するブックマークレット3

ウェブページにある画像と背景画像を表示するブックマークレット3のポップアップ画像

Karafuto Blog: ウェブページにある画像と背景画像を表示するブックマークレット (2)をまた少し変えてみた。

ブックマークレットは、新しいウィンドウを開いて、画像を表示して並べる。表示する画像は、img要素の画像と CSSで指定された背景画像。

変更したところ

  • 一画面にすべての画像が収まるようにした。
  • 画像をクリックした時、ページ上に画像をポップアップ表示するようにしてみた。(ページ上に透明度のある div要素を被せて、その上に画像を表示する。)
  • ページの上でマウスホイールを回すか,を押せば、ポップアップした画像を換える。ホイールを向こう側に回すか(左)を押すと前の画像に、手前に回すか(右)を押すと後の画像に換える。
  • ページのどこかをクリックするかESCを押せば、ポップアップした画像を消す。

ウェブページにある画像と背景画像を表示するブックマークレット3

スクリプトが長くなったので、サイトからスクリプトを読みこんで実行している。

javascript:(function (){
    var script = document.createElement('script');
    script.type = 'text/javascript'; 
    script.charset = 'UTF-8';
    script.src = 'http://blog-imgs-41.fc2.com/k/a/r/karafuto50/bookmarklet_displayimages.js';
    document.body.appendChild(script);
})();
ブックマークレットで読みこんでいるファイル
http://blog-imgs-41.fc2.com/k/a/r/karafuto50/bookmarklet_displayimages.js

ちなみに、サイトからスクリプトを読み込まないで、コードをそのまま書いた下のブックマークレットを実行すると、画像が表示されるまでにかなり時間がかかる。ブックマークレットに8112文字も突っこんじゃダメだよな。

スクリプトをそのまま書いた Webページにある画像と背景画像を表示するブックマークレット3

* IE、Firefoxでは動きません。Operaしか確認してません。

追記: 2008年11月13日 ブックマークレットのウィンドウのタイトルに画像の数が表示されていなかったのを修正した。

Comments:0

Comment Form

Trackback+Pingback:0

TrackBack URL for this entry
http://karafuto50.blog117.fc2.com/tb.php/185-dd1aa378
Listed below are links to weblogs that reference
ウェブページにある画像と背景画像を表示するブックマークレット (3) from Karafuto Blog

Home > javascript > ウェブページにある画像と背景画像を表示するブックマークレット (3)

おまかせリンク(R)
全記事表示リンク
Search
Meta
Feeds

Page Top

上記広告は1ヶ月以上更新のないブログに表示されています。新しい記事を書くことで広告を消せます。