類似画像検索ブックマークレット「誰娘」のGithubページを公開しました

「Google画像検索」を利用して、画像から類似画像を検索する方法と、その補助ブックマークレット「誰娘」を以前に公開しました。

Googleを利用して画像から類似画像を検索する方法

http://rrvf.blogspot.jp/2013/01/google-image-search.html

簡単にページ内の類似画像を検索できるブックマークレット「誰娘」

http://rrvf.blogspot.jp/2013/02/bookmarklet-image-search-dareko.html

今回は、作成したブックマークレット「誰娘」をGitHubで管理しようと思ったので、ついでに専用ページも作ってみました。

誰娘 - dareko - 類似画像検索用ブックマークレット

http://darekonoko.github.io/

上記サイトより、ブックマークレットの取得が可能となります。

このサイトでは、リモートに公開してあるJavascriptを取得して実行する形式となっています。そこに不安を感じる方は、GitHubよりソースコードから直接ブックマークレットを生成することをおすすめします。

興味のある方は、是非使ってみてください。どうぞよろしくお願いします。

技術的な内容

このブックマークレットは、恐らくほとんどの最新のブラウザで動作が可能だと思われます。

しかし、以下の比較的新しい実装や、古いブラウザと互換性のない技術を利用しています。

1. CSS関連
   1. display: inline-block を使用してアイテムを一覧表示しています。対応していないブラウザの場合、表示が崩れます。
   2. position: fixed を使用しています。対応していないブラウザの場合、表示が著しく崩れます。
2. Javascript関連
   1. class名を要素に設定する際に、element.setAttribute("class", "hoge")を使用しています。この方法は古いInternetExplorerでは対応していません。
      対応する場合は、該当部分をelement.className = "hoge";に変更する必要があります。
   2. 要素にイベントを設定する際に、element.addEventListenerを使用しています。この方法は古いInternetExplorerでは対応していません。
      対応する場合は、該当部分をelement.attachEventに変更する必要があります。

このように、古いブラウザ（特にInternetExplorer）を切り捨てる実装となっています。

詳しくはGithubよりソースコードを参照してください。

darekonoko/darekonoko.github.io at master - GitHub

https://github.com/darekonoko/darekonoko.github.io/tree/master