javascript解决Firefox浏览器不支持zoom等比例缩放方法

由于Firefox浏览器不支持CSS3属性 zoom，所以前面jQuery + CSS属性zoom实现web页面等比例缩放的代码不支持火狐浏览器，要兼容Firefox浏览器，目前想到的方法是借且CSS3属性 transform，但是有点麻烦，适合缩放元素少的网页使用。

1、给每一个需要等比缩放的元素添加class="scale"

2、然后使用下面的js代码

(function(doc, win){
	var scal = 1,
		obj = doc.getElementsByClassName('scale');
	var res = function(){
		var docW = doc.documentElement.clientWidth;
		if(docW >= 1920){
			scal = 1;
		}else if(docW < 1920 && docW > 1200){
			scal = docW / 1920;
		}else if(docW <= 1200){
			scal = 1200 / 1920;
		}	
		if('zoom' in doc.body.style 
			|| '-ms-zoom' in doc.body.style 
			|| '-webkit-zoom' in doc.body.style 
			|| '-moz-zoom' in doc.body.style 
			|| '-o-zoom' in doc.body.style
		){
			doc.body.style.zoom = scal;			
		}else{
			for(i = 0; i<obj.length; i++){
				obj[i].setAttribute('style','transform-origin:left top;transform:scale('+scal+')');
			}						
		}		
	};
	win.addEventListener('resize', res, false);
	doc.addEventListener('DOMContentLoaded', res, false);
})(document, window);

需要注意的是：如果是居中元素，需要把代码中的 transform-origin:left top;改成 transform-origin:center top; 居右的则改成 transform-origin:right top; 建议单独添加个样式来定义 transform-origin 位置。