基于JQuery的Iframe自适应

HTML代码

	
		测试页
		
		
	
	
	



/**
 * iframe自适应代码,可以定义在公共js里
 */
(function () {
	if ($("meta[name=autoHeight]").get(0) != undefined) {
		var html = "";
		html += ' function updateIframe(targetId,height){';
		html += ' /*动态拼接的代码*/ \n';
		html += ' var stop = false;\n';
		html += ' $("iframe").each(function(index,data){\n';
		html += ' if(stop){\n';
		html += ' return ;\n';
		html += ' }\n';
		html += ' var src = $(data).attr("src");\n';
		html += ' if(src == targetId){\n';
		html += ' $(data).height(height);\n';
		html += ' stop = true;\n';
		html += ' return ;\n';
		html += ' }\n';
		html += ' });\n';
		html += ' }\n';
		if (isScroll().scrollY) {
			while (isScroll().scrollY) {
				var id = window.location.pathname + window.location.search;
				var oldHeight = $("body").height();
				var newHeight = oldHeight + 100;
				$("body").height(newHeight);
				if (typeof(parent.updateIframe) === "undefined") {
					parent.eval(html);
				}
				parent.updateIframe(id, newHeight);
			}
		}
	}
})();


/**
 * 是否出现滚动条
 */
var isScroll = function (el) {
	var elems = el ? [el] : [document.documentElement, document.body];
	var scrollX = false,
	scrollY = false;
	for (var i = 0; i < elems.length; i++) {
		var o = elems[i];
		// test horizontal
		var sl = o.scrollLeft;
		o.scrollLeft += (sl > 0) ? -1 : 1;
		o.scrollLeft !== sl && (scrollX = scrollX || true);
		o.scrollLeft = sl;
		// test vertical
		var st = o.scrollTop;
		o.scrollTop += (st > 0) ? -1 : 1;
		o.scrollTop !== st && (scrollY = scrollY || true);
		o.scrollTop = st;
	}
	// ret
	return {
		scrollX: scrollX,
		scrollY: scrollY
	};
};





你可能感兴趣的:(基于JQuery的Iframe自适应)