iMDB Large Images

Large iMDB images when you hover over them.

目前为 2015-07-26 提交的版本,查看 最新版本

  1. // ==UserScript==
  2. // @name iMDB Large Images
  3. // @version 1.0.6
  4. // @description Large iMDB images when you hover over them.
  5. // @match http://imdb.com/*
  6. // @match https://imdb.com/*
  7. // @match http://*.imdb.com/*
  8. // @match https://*.imdb.com/*
  9. // @icon data:image/png;base64,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
  10. // @require http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js
  11. // @grant none
  12. // @namespace https://greasyfork.org/users/13667
  13. // ==/UserScript==
  14.  
  15. /*!
  16. * hoverIntent r7 // 2013.03.11 // jQuery 1.9.1+
  17. * http://cherne.net/brian/resources/jquery.hoverIntent.html
  18. *
  19. * You may use hoverIntent under the terms of the MIT license.
  20. * Copyright 2007, 2013 Brian Cherne
  21. */
  22. (function(e){e.fn.hoverIntent=function(t,n,r){var i={interval:100,sensitivity:7,timeout:0};if(typeof t==="object"){i=e.extend(i,t)}else if(e.isFunction(n)){i=e.extend(i,{over:t,out:n,selector:r})}else{i=e.extend(i,{over:t,out:t,selector:n})}var s,o,u,a;var f=function(e){s=e.pageX;o=e.pageY};var l=function(t,n){n.hoverIntent_t=clearTimeout(n.hoverIntent_t);if(Math.abs(u-s)+Math.abs(a-o)<i.sensitivity){e(n).off("mousemove.hoverIntent",f);n.hoverIntent_s=1;return i.over.apply(n,[t])}else{u=s;a=o;n.hoverIntent_t=setTimeout(function(){l(t,n)},i.interval)}};var c=function(e,t){t.hoverIntent_t=clearTimeout(t.hoverIntent_t);t.hoverIntent_s=0;return i.out.apply(t,[e])};var h=function(t){var n=jQuery.extend({},t);var r=this;if(r.hoverIntent_t){r.hoverIntent_t=clearTimeout(r.hoverIntent_t)}if(t.type=="mouseenter"){u=n.pageX;a=n.pageY;e(r).on("mousemove.hoverIntent",f);if(r.hoverIntent_s!=1){r.hoverIntent_t=setTimeout(function(){l(n,r)},i.interval)}}else{e(r).off("mousemove.hoverIntent",f);if(r.hoverIntent_s==1){r.hoverIntent_t=setTimeout(function(){c(n,r)},i.timeout)}}};return this.on({"mouseenter.hoverIntent":h,"mouseleave.hoverIntent":h},i.selector)}})(jQuery)
  23.  
  24. $(document).ready(function() {
  25.  
  26. var cssCode = "\
  27. #largeImagePopover { \
  28. position: absolute; \
  29. box-shadow: 0 0 15px #000; \
  30. cursor: pointer; \
  31. z-index: 1000; \
  32. } \
  33. ";
  34. var styleElement = document.createElement("style");
  35. styleElement.type = "text/css";
  36. if (styleElement.styleSheet) {
  37. styleElement.styleSheet.cssText = cssCode;
  38. } else {
  39. styleElement.appendChild(document.createTextNode(cssCode));
  40. }
  41. document.getElementsByTagName("head")[0].appendChild(styleElement);
  42.  
  43. var hoverInFunction = function (e) {
  44.  
  45. var hoveredImage = this.src ? this : $(this).find('img').get(0);
  46. hoveredImage.style.cursor = 'progress';
  47.  
  48. $('div#largeImagePopover, div.largeImagePopover').remove();
  49. $("body").css("overflow", "auto");
  50.  
  51. // setup the large image
  52. var popImage = document.createElement("img");
  53. var src = hoveredImage.src;
  54. src = src.replace(/_V1\.?.*?_\./g,"_V1_.");
  55. src = src.replace(/_V1_?\.jpg/,"_V1_SY"+window.innerHeight+"_.jpg");
  56.  
  57. popImage.src = src
  58. popImage.alt = hoveredImage.alt;
  59. popImage.border = 0;
  60.  
  61. // setup the image link
  62. var popLink = document.createElement("a");
  63. popLink.href = $(hoveredImage).parents('a').attr('href');
  64. popLink.appendChild(popImage);
  65.  
  66. // setup the image div
  67. var popDiv = document.createElement("div");
  68. popDiv.id = 'largeImagePopover';
  69. popDiv['class'] = 'largeImagePopover';
  70. popDiv.appendChild(popLink);
  71. $(popDiv).hide();
  72.  
  73. // attach events to new image
  74. $(popImage).mouseout( function() {
  75. $(popDiv).remove();
  76. });
  77. $(popImage).css('cursor','crosshair');
  78.  
  79. $(popImage).load( function() {
  80. // these assignments may differ per browser
  81. var pageXOffset = window.pageXOffset;
  82. var pageYOffset = window.pageYOffset;
  83. var innerWidth = window.innerWidth;
  84. var innerHeight = window.innerHeight;
  85. var mouseX = e.pageX;
  86. var mouseY = e.pageY;
  87.  
  88. // shrink image if wider than screen
  89. if(popImage.width > innerWidth-17) {
  90. var tmpW = popImage.width;
  91. popImage.width = Math.min(popImage.width,innerWidth-17);
  92. popImage.height = (popImage.width/tmpW) * popImage.height;
  93. }
  94. if(popImage.height > innerHeight) {
  95. var tmpH = popImage.height;
  96. popImage.height = Math.min(popImage.height,innerHeight);
  97. popImage.width = (popImage.height/tmpH) * popImage.width;
  98. }
  99.  
  100. // center image on mouse cursor
  101. var x = mouseX - parseInt(popImage.width/2);
  102. var y = mouseY - parseInt(popImage.height/2);
  103.  
  104. // move image down and right if off screen to the left or top
  105. x = Math.max(x,pageXOffset);
  106. y = Math.max(y,pageYOffset);
  107.  
  108. // move image up or left if off screen to the right or bottom
  109. x = Math.min(x, pageXOffset + innerWidth - 17 - popImage.width);
  110. y = Math.min(y, pageYOffset + innerHeight - popImage.height);
  111.  
  112. // move image down and right if off screen to the left or top
  113. x = Math.max(x,pageXOffset);
  114. y = Math.max(y,pageYOffset);
  115.  
  116. $(popImage.parentNode.parentNode).css('left',x);
  117. $(popImage.parentNode.parentNode).css('top',y);
  118. $(popImage.parentNode.parentNode).show();
  119.  
  120. hoveredImage.style.cursor = 'crosshair';
  121. });
  122.  
  123. $('body').append($(popDiv));
  124. };
  125.  
  126. $(document).keyup(function(e) {
  127. if (e.keyCode == 27) {
  128. $('div#largeImagePopover, div.largeImagePopover').remove();
  129. }
  130. });
  131. function checkImages() {
  132. $("img[src*='_V1']").not("img[src*='_ZA']").not(".imageDone").each(function() {
  133. $(this).addClass('imageDone').css('cursor','crosshair').hoverIntent( hoverInFunction, function(){} );
  134. });
  135. window.setTimeout(checkImages, 1000);
  136. }
  137. checkImages();
  138.  
  139. });