js实现图片预览可旋转、放大缩小功能实现

使用jquery.magnify.js 实现图片操作的功能

本地浏览器如果是ie8及以上可以直接用,如果ie8需要将插件做下修改
代码修改前:

icons: {
      minimize: '\
                \
                ',
      maximize: '\
                \
                ',
      close: '\
              \
              ',
      zoomIn: '\
              \
              ',
      zoomOut: '\
              \
              ',
      prev: '\
            \
            ',
      next: '\
            \
            ',
      fullscreen: '\
                  \
                  ',
      actualSize: '\
                  \
                  ',
      rotateLeft: '\
                  \
                  ',
      rotateRight: '\
                    \
                    '
    }

代码修改后:

icons: {
      minimize:  isIE8() ? '\
    	  		\
                ':
                '\
                \
                ',
      maximize: isIE8() ? '\
    		  	\
                ' :
                '\
                \
                ',
      close: isIE8() ? '\
	    		  \
	              ' :
              '\
              \
              ',
      zoomIn: isIE8() ? '\
    		  \
              ' :
              '\
              \
              ',
      zoomOut: isIE8() ? '\
    		  \
              ':
              '\
              \
              ',
      prev: isIE8() ? '\
    		  \
    		  ' : 
    		  '\
              \
              ',
      next: isIE8() ? '\
    		  	\
	            ' : 
	            '\
	            \
	            ',
      fullscreen: isIE8() ? '\
    		  		\
                  ' : 
                  '\
                  \
                  ',
      actualSize: isIE8() ? '\
    		  		\
                  ' : 
                  '\
                  \
                  '	  ,
      rotateLeft: isIE8() ? '\
    		  		\
                  ' : 
                  '\
                  \
                  '	  ,
      rotateRight: isIE8() ? '\
    		  			\
                    	' :
                    	'\
                        \
                        '	
    },

说明一下:ie8不支持svg标签,所以将path替换成image标签直接引入图片。

你可能感兴趣的:(js)