Userscript - 自家製Google Image Search Preview

這類Google Image的Userscript有很多，但在userscripts.org上，做同樣功能的script，很多都沒有更新。



Google卻有時會更新頁面HTML碼導致Userscript失效，當然Firefox都有活躍的Extension如Thumbnail Zoom做到。

但既然如此，不如我自己寫一個出來，反正不是什麼深奧技術。
想使用的人，可以Select All然後Copy&Paste另傳一個txt文件，rename做js檔，拉去Firefox就可以安裝。

// ==UserScript==
// @name           Google Image Search Preview
// @version      18/09/2011
// @namespace      達MiNG
// @description    Mouse over and preview the image on Google images search result. This userscript will redirect Google Images to basic version. Find me at http://www.netatlantis.com/?p=3115
// @icon       https://lh5.googleusercontent.com/-Sookp-flc2I/TnXlDfP-0OI/AAAAAAAABTU/1vNWqGX4kYI/google-icon.png
// @require        http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js
// @include        http://www.google.com/search?q=*&tbm=isch*
// ==/UserScript==

function addGlobalStyle(css) {
 var head, style;
 head = document.getElementsByTagName('head')[0];
 if(!head) {
  return;
 }
 style = document.createElement('style');
 style.type = 'text/css';
 style.innerHTML = css;
 head.appendChild(style);
}

// a function that loads jQuery and calls a callback function when jQuery has finished loading
function addJQuery(callback) {
 var script = document.createElement("script");
 script.setAttribute("src", "http://ajax.googleapis.com/ajax/libs/jquery/1.5.2/jquery.min.js");
 script.addEventListener('load', function() {
  var script = document.createElement("script");
  script.textContent = "(" + callback.toString() + ")();";
  document.body.appendChild(script);
 }, false);
 document.body.appendChild(script);
}

this.imagePreview = function() {
 /* CONFIG */
 xOffset = 10;
 yOffset = 30;

 // these 2 variable determine popup's distance from the cursor
 // you might want to adjust to get the right result

 /* END CONFIG */
 $("a.preview").hover(function(e) {
  this.t = this.title;
  this.title = "";
  var c = (this.t != "") ? "" + this.t : "";

  var src = this.href;
  if(src.indexOf('imgurl=') != -1) {
   var vars = [], hash;
   var hashes = src.slice(window.location.href.indexOf('?') + 1).split('&');
   for(var i = 0; i < hashes.length; i++) {
    hash = hashes[i].split('=');
    vars.push(hash[0]);
    vars[hash[0]] = hash[1];
   }
   src = vars["imgurl"];
  }

  $("body").append("
" + c + "
");
  $("#preview").css("top", (e.pageY - xOffset) + "px").css("left", (e.pageX + yOffset) + "px").fadeIn("fast");
 }, function() {
  this.title = this.t;
  $("#preview").remove();
 });
 $("a.preview").mousemove(function(e) {
  $("#preview").css("top", (e.pageY - xOffset) + "px").css("left", (e.pageX + yOffset) + "px");
 });
};
// starting the script on page load
$(document).ready(function() {

 var standardUrl = window.location.href;

 if(standardUrl.indexOf('sout=1') == -1) {
  var addToUrl = '&sout=1';
  var basicUrl = standardUrl + addToUrl;

  window.location.replace(basicUrl);
 } else {
  addGlobalStyle('#preview{ position:absolute; border:1px solid #ccc; padding:0px; display:none;width:37px;height:37px;background-image:url(https://lh4.googleusercontent.com/-Nv-RqxGFQUg/TnXlCyUr_uI/AAAAAAAABTQ/hSiOpUTdufA/20088258937578778044.gif) }');

  $('#imgtb a').addClass('preview');
  // load jQuery and execute the main function
  addJQuery(imagePreview);
 }

});