クイックイメージブラウズ

クイックイメージブラウズ イメージ閲覧中のページから直接リンクされた画像や、ページ内の大きな画像をライトボックス風にブラウズします。
左上の四角をクリックするとイメージブラウザを閉じます。
Google Images やYahoo画像検索の検索結果ページでは、検索結果の元画像を直接一覧表示することができます。
使い方によっては、大きな画像を大量に読み込むので、多くのメモリを消費してしまいます。
文字数制限などが許せば、拡大縮小などの機能を追加していく予定です。

クイックイメージブラウズ のカスタマイズ

update: 2009-01-21


Javascript ソースコードの確認

(function(){
var D=document,B=D.getElementsByTagName('body')[0];
var list=[],WP,tb,bk,idx,vw,pic,i,th=100,tmp,size;

var Ls=D.getElementsByTagName('a');
for( i=0; i < Ls.length;i++){
 if( Ls[i].href.match(/(http:\/\/[^\:]+\.(jpg|png|gif))/i) || Ls[i].href.match(/(.+\.(jpg|png|gif)$)/i) ){
  tmp=D.createElement('img');
  tmp.src=RegExp.$1;
  tmp.title=RegExp.$1 + ' / ' + Ls[i].innerText;
  list.push(tmp);
 }
}
var Ls=D.images;
for( i=0; i < Ls.length;i++){
 if( Ls[i].width > 179 && Ls[i].height > 179){
  tmp=D.createElement('img');
  tmp.src=Ls[i].src;
  tmp.title=Ls[i].src +' / '+Ls[i].alt;
  list.push(tmp);
 }
}

B.appendChild(WP=D.createElement('div'));
WP.id='QLB';
WP.appendChild(bk=D.createElement('div'));
WP.appendChild(vw=D.createElement('div'));
vw.appendChild(pic=D.createElement('img'));
WP.appendChild(idx=D.createElement('div'));
WP.appendChild(tb=D.createElement('div'));
with(bk.style){
 position='fixed';top='0px';left='0px';width='100%';height='100%';
 background='black';opacity='0.8';filter='alpha(opacity=80)';
 zIndex='99998';
}
with(idx.style){
 position='fixed';bottom='0px';left='0px';width='100%';height=th+40+'px';overflow='auto';
 zIndex='99999';whiteSpace='nowrap';
}
with(vw.style){
 position='fixed';top='20px';right='0px';bottom=th+40+'px';width='100%';overflow='auto';
 zIndex='99999';
}
with(pic.style){
 margin='auto';display='block';
}
with(tb.style){
 position='fixed';top='0px';right='0px';width='100%';height='20px';overflow='auto';color='white';
 zIndex='99999';lineHeight='18px';background='black';fontSize='11px';
}
tb.innerHTML='
<div style="width:10px;height:10px;border:#666 solid 1px;margin:4px;float:left;" onclick="this.parentNode.parentNode.style.display=\'none\'" title="Close this"></div>
<div style="float:right;"><a href="http://bookmarklet.web.fc2.com?source=Q" target="_blank" style="color:#888">more Bookmarklets...</a></div>
<span>Quick Image Browser</span>
';

for(i=0; i < list.length;i++){
 idx.appendChild(list[i]);
 with(list[i].style){
  height= th+'px';
  width= th +'px';
  margin='6px';
 }
 list[i].onclick=function(){
  pic.src=this.src;
 };
 list[i].onload=function(){
  if(this.naturalHeight){
   this.style.width = th/this.naturalHeight*this.naturalWidth  +'px';
  }
 };
 list[i].onerror= function(){
  this.style.display='none';
 };
}

})()
クイックイメージブラウズ ←このボタンをブックマークバーにドラッグ

「クイックイメージブラウズ」に関連するブックマークレット

リンク情報の整理 詳細...

リンク情報の整理 イメージ表示中のページのリンク情報をリンク先毎に整理して、サイドバー風に表示します。 初めて訪れたサイトなどで、ページ構造が複雑な場合などに有効です。

update: 2009-02-09

リンクされた画像をすべて開く 詳細...

表示中のWEBページからリンクされた画像をすべて開きます

update: 2008-12-29

ブログでの注目度と評判(Yahoo) 詳細...

ブログでの注目度と評判(Yahoo) イメージ選択したテキストを対象に、Yahoo!ブログ検索の「注目度の推移」と「評判」のグラフをパレットに表示します。グラフをクリックやドラッグすると検索結果ページを表示します。

update: 2009-02-04

ページ内アンカーリスト 詳細...

ページ内アンカーリスト イメージ閲覧中のページで使われているアンカー(a要素 name属性)をリスト表示します。ページ内ナビゲータとして手軽に使うことができます。

update: 2009-02-02

リンクタグを生成 詳細とカスタマイズ...

表示中のページへのリンクタグを作成します。Favicon の定義があるページでは、Faviconの<img>要素も付加します。

update: 2009-01-28

Google 画像検索 詳細とカスタマイズ...

ページ内の選択した文字列をGoogle Imageで検索します。【連続検索対応】

update: 2009-01-07

カスタム検索パネル 詳細とカスタマイズ...

カスタム検索パネル イメージよく使う検索サービスを一括で操作するブックマークレットを作ることが出来ます。

update: 2009-01-28

リンクしているページを検索 詳細とカスタマイズ...

表示しているページに対してリンクしているページをGoogleで検索します

update: 2009-01-06

サイト内検索 詳細とカスタマイズ...

Googleのサイト内検索を使って、閲覧中のサイト内で選択したフレーズを検索します。 なにも選択せずに実行すると、Googleにインデックスされている閲覧中のサイト内のページがすべて検索されます。

update: 2009-01-06

このページをブックマーク

Top 20

クイックイメージブラウズ 詳細...

クイックイメージブラウズ イメージ閲覧中のページから直接リンクされた画像や、ページ内の大きな画像をライトボックスっぽくブラウズします。Google Images 検索及び、Yahoo画像検索にも対応しています。

update: 2009-01-21

リンク先のフルURLを表示 詳細...

リンクテキストをhttpなどから始まるフルURLに置き換えます

update: 2008-12-30

Gmailテンプレート 詳細とカスタマイズ...

Gmailテンプレート イメージGmailのメールテンプレートをブックマークレットとして保存して、ブックマークバーからいつでも呼び出すことができます

update: 2009-01-26

GoogleReaderに追加 詳細...

表示しているウェブサイトのフィードをGoogle Reader またはiGoogleへ追加

update: 2009-01-01

Evernoteでクリップ 詳細...

Evernoteでクリップ イメージ表示中のページを Evernote でクリップします

update: 2009-01-03

リンクされた画像をすべて開く 詳細...

表示中のWEBページからリンクされた画像をすべて開きます

update: 2008-12-29

外部リンク/内部リンクに色づけ 詳細...

外部リンク/内部リンクに色づけ イメージ外部リンクを赤色、内部リンクを青色、その他のリンクをオレンジ色の点線で囲みます。

update: 2009-02-08

Google Bookmarkに追加 詳細...

表示中のページをGoogle Bookmarksに追加するダイアログを表示します。

update: 2009-01-03

画像を拡大 詳細...

ページ内の画像を2倍に拡大します

update: 2008-12-31

Youtube動画をMP4でダウンロード 詳細...

Youtube動画をMP4でダウンロード イメージYoutube内の動画をPC等で扱いやすいMP4でダウンロードするリンクを表示させます

update: 2008-12-31

プラグイン要素を消去 詳細...

Flashやムービー、Javaアプレット、外部サーバーからのインラインフレームをページ上から消去します

update: 2008-12-30

リンク先URLを表示 詳細...

リンクテキストをリンク先URLに置き換えます

update: 2008-12-30

goo辞書で調べる 詳細とカスタマイズ...

ページ内の選択した文字列をgoo辞書で検索します。【連続検索対応】

update: 2009-01-13

サイト内検索 詳細とカスタマイズ...

Googleのサイト内検索を使って、閲覧中のサイト内で選択したフレーズを検索します。 なにも選択せずに実行すると、Googleにインデックスされている閲覧中のサイト内のページがすべて検索されます。

update: 2009-01-06

前のページ番号 詳細とカスタマイズ...

URLに含まれる数字の部分を1減らします

update: 2009-02-02

Google検索 詳細とカスタマイズ...

ページ内の選択した文字列をGoogleで検索します。【連続検索対応】

update: 2009-01-26

テキスト翻訳(英語→日本語) 詳細とカスタマイズ...

ページ内の選択したテキストを Google 翻訳 で英語から日本語にテキスト翻訳します。【連続検索対応】

update: 2009-01-19

サイトのトップへ 詳細...

ドメインのトップURL(普通はトップページ)に移動します

update: 2008-12-31

画像を消去 詳細...

ページ内の画像を消去し、代替テキスト(alt属性の内容)に置き換えます

update: 2008-12-30

リンクを別ウインドウでひらく 詳細...

ページ内のリンクをクリックした際、新しいウインドウで開くようにしますが、次々に新しいウインドウを作るのではなく、1つのウインドウを再利用するようにします

update: 2008-12-30

inserted by FC2 system