c

Author: dolymood

src/imageViewer/ImageView.js

@@ -100,22 +100,36 @@ define([], function() {
  this.options.movingCheck = !!this.options.movingCheck;
  this.options.shiftWheelZoom = !!this.options.shiftWheelZoom;
  newImg.src = this.img.src;
+ var loaded = false;
+ this.error = false;
  if (!newImg.complete) {
- newImg.onload = newImg.onerror = function() {
- that.img.style.display = 'block';
+ newImg.onload = function() {
+ if (loaded) return;
+ loaded = true;
+ that.img.style.display = 'inline-block';
  that.container = getParentElement(img);
  that.init();
  that.bindEvts();
  };
+ newImg.onerror = function() {
+ if (loaded) return;
+ loaded = true;
+ // 出错时啥也不干了
+ that.error = true;
+ that.img.style.display = 'inline-block';
+ that.init();
+ that.img.style.visibility = 'visible';
+ };
  var interval = setInterval(function() {
  if (newImg.complete) {
  clearInterval(interval);
  newImg.onload();
  }
  }, 100)
  } else {
+ loaded = true;
  setTimeout(function() {
- that.img.style.display = 'block';
+ that.img.style.display = 'inline-block';
  that.container = getParentElement(img);
  that.init();
  that.bindEvts();
@@ -150,6 +164,7 @@ define([], function() {
 
  init: function() {
  if (this.options.onload) this.options.onload();
+ if (this.error) return;
  this.initPos = {
  x: 0,
  y: 0
@@ -232,10 +247,11 @@ define([], function() {
  },
 
  scale: function(scale, poi) {
+ if (this.error) return;
  var w = this.w;
  var h = this.h;
  if (this.zoom <= 20 && scale < 0) {
- return;
+ return
  }
  w += w*scale*this.options.scaleNum;
  h += h*scale*this.options.scaleNum;
@@ -455,6 +471,7 @@ define([], function() {
  },
 
  rotate: function(deg) {
+ if (this.error) return;
  this.center({
  x: 0,
  y: 0

src/imageViewer/sample/imageViewer.css

@@ -43,7 +43,7 @@ button {overflow: visible; width: auto; padding: 0; -moz-box-sizing: content-box
 .viewerC .rightH:hover .cr {background-position:-60px 0;}
 .viewerC .rightH:active .cr {background-position:-120px 0;}
 .viewerC .viewer {position:relative;height:100%;padding:0 70px;}
-.viewerC .imgBder {height:100%;width:100%;overflow:hidden;}
+.viewerC .imgBder {height:100%;width:100%;overflow:hidden;text-align:center;}
 .viewerC .imgBder.imgLoading {background:url(//s4.ksyun.com/i/4/006.png) no-repeat center}
 .viewerC .imgBder:before {content:''}
 .viewerC .imgBder:before {display:inline-block;width:0;height:100%;vertical-align:middle;}