WEB开发网
开发学院网页设计JavaScript JS 缩放指定的html元素 阅读

JS 缩放指定的html元素

 2012-11-20 15:12:25 来源:WEB开发网   
核心提示:/* * 缩放函数zoomIt,它实际缩放的是el的内部元素 * @param {htmlElemnt} el 缩放目标htmlElement * @param {Number} xScale x方向缩放比例 * @param {Number} yScale y方向缩放比例 */zoomIt : function(el
/*
		 * 缩放函数zoomIt,它实际缩放的是el的内部元素
		 * @param {htmlElemnt} el 缩放目标htmlElement
		 * @param {Number} xScale x方向缩放比例
		 * @param {Number} yScale y方向缩放比例
		 */
		zoomIt : function(el, xScale, yScale) {
			var S = KISSY,
				style = $(el).attr('style') || "";
			if(S.UA['firefox']) {
				$(el).attr('style', 
					style + 
					'transform: scale(' + xScale + ', ' + yScale + '); ' +
					'transform-origin: 0px 0px;'
				);
			}
			else if(S.UA['ie'] >= 9) {
				$(el).attr('style', 
					style + 
					'-ms-transform: scale(' + xScale + '); ' +
					'-ms-transform-origin-x: 0px; -ms-transform-origin-y: 0px;'
				);
			}
			else if(S.UA['ie'] < 9) {
				$(el).css('zoom', xScale);
			}
			else {
				$(el).attr('style', 
					style + 
					'-webkit-transform: scale(' + xScale + ', ' +  yScale + '); ' +
					'-webkit-transform-origin: 0px 0px;'
				);
			}
		}

在浏览器的判断是,这里使用了KISSY;在属性操作上,这里用JQ. 读者可以根据自己的习惯进行相应的修改。

Tags:JS 缩放 指定

编辑录入:爽爽 [复制链接] [打 印]
赞助商链接