☰

ImageZoom

[Maxthon] Autofits images in separate tabs to fill the window and enables you to zoom with the mousewheel. Doubleclick the image to reset the size.

当前为 2014-11-12 提交的版本，查看 最新版本。

  1. // ==UserScript==
  2. // @name ImageZoom
  3. // @author ElDoRado1239
  4. // @description [Maxthon] Autofits images in separate tabs to fill the window and enables you to zoom with the mousewheel. Doubleclick the image to reset the size.
  5. // @version 0.99
  6. // @grant none
  7. // @include *.jpg*
  8. // @include *.JPG*
  9. // @include *.jpeg*
  10. // @include *.JPEG*
  11. // @include *.png*
  12. // @include *.PNG*
  13. // @include *.gif*
  14. // @include *.GIF*
  15. // @include *.bmp*
  16. // @include *.BMP*
  17. // @namespace https://greasyfork.org/users/6103
  18. // ==/UserScript==
  19.  
  20. var img;
  21. setTimeout(init,100);
  22.  
  23. function init(){
  24. 	img = document.getElementById('img_elem');
  25. 	if(img.naturalWidth==0){setTimeout(init,100);return;}
  26. 	var s = document.title;
  27. 	if(s.indexOf(img.src.substr(img.src.lastIndexOf('/')+1))==-1 || s.indexOf(img.naturalWidth+'')==-1 || s.indexOf(img.naturalHeight+'')==-1) return;
  28. 	img.id = "img";
  29. 	img.class = "";
  30. 	img.style["-webkit-backface-visibility"] = "hidden";
  31. 	img.style["position"] = "absolute";
  32. 	img.style["left"] = "0px";
  33. 	img.style["top"] = "0px";
  34. 	img.ondblclick = fit;
  35. 	document.addEventListener('mousewheel',mouseWheel,false);
  36. 	document.getElementById('scroll_v').outerHTML = '';
  37. 	document.getElementById('scroll_h').outerHTML = '';
  38. 	window.addEventListener('resize',fit,false);
  39. 	window.addEventListener('change',fit,false);
  40. 	fit();
  41. }
  42. function mouseWheel(e){
  43. 	var ratio = img.naturalHeight/img.naturalWidth;
  44. 	var prewidth = img.width;
  45. 	var preheight = img.height;
  46. 	if(e.wheelDelta > 0){
  47. 		img.style.width = parseInt(img.style.width)*1.1 + 'px';
  48. 		img.style.height = parseInt(img.style.width)*ratio + 'px';
  49. 	}
  50. 	if(e.wheelDelta < 0){
  51. 		img.style.width = parseInt(img.style.width)*0.90 + 'px';
  52. 		img.style.height = parseInt(img.style.width)*ratio + 'px';
  53. 	}
  54. 	img.style.left = (window.innerWidth/2-parseInt(img.style.width)/2)+"px";
  55. 	img.style.top = (window.innerHeight/2-parseInt(img.style.height)/2)+"px";
  56. }
  57. function fit(){
  58. 	if(img.naturalHeight>=img.naturalWidth){
  59. 		img.style.height = window.innerHeight;
  60. 		img.style.width = window.innerHeight*(img.naturalWidth/img.naturalHeight);
  61. 		img.style.left = ((window.innerWidth-parseInt(img.style.width))/2)+"px";
  62. 		img.style.top = "0px";
  63. 	}
  64. 	if(img.naturalWidth>img.naturalHeight){
  65. 		img.style.width = window.innerWidth;
  66. 		img.style.height = window.innerWidth*(img.naturalHeight/img.naturalWidth);
  67. 		img.style.left = "0px";
  68. 		img.style.top = ((window.innerHeight-parseInt(img.style.height))/2)+"px";
  69. 	}
  70. 	if(parseInt(img.style.width)>window.innerWidth){
  71. 		img.style.width = window.innerWidth;
  72. 		img.style.height = window.innerWidth*(img.naturalHeight/img.naturalWidth);
  73. 		img.style.left = "0px";
  74. 		img.style.top = ((window.innerHeight-parseInt(img.style.height))/2)+"px";
  75. 	}
  76. 	if(parseInt(img.style.height)>window.innerHeight){
  77. 		img.style.height = window.innerHeight;
  78. 		img.style.width = window.innerHeight*(img.naturalWidth/img.naturalHeight);
  79. 		img.style.left = ((window.innerWidth-parseInt(img.style.width))/2)+"px";
  80. 		img.style.top = "0px";
  81. 	}
  82. }