`
piperzero
  • 浏览: 3534501 次
  • 性别: Icon_minigender_1
  • 来自: 杭州
文章分类
社区版块
存档分类
最新评论

获得el所在的第一级zoom父元素的zoom值及该父元素left/top偏移量

 
阅读更多
/*
		 * 获得el所在的第一级zoom父元素的zoom值及该父元素left/top偏移量
		 * @param {htmlEl} el 目标元素
		 * @return {Object}
		 * <p>Object.value {Number} 默认-1</p>
		 * <p>Object.top {Number} 父元素的offsetTop + 顶部空白 </p>
		 * <p>Object.left {Number} 父元素的offsetLeft + 左边空白 </p>
		 */
		getZoomArgs : function(el) {
			// 标示缩放的css属性
			var zoomPer, undefinedPer = 'none';
			if(S.UA['firefox']) {
				zoomPer = '-moz-transform';
			} 
			else if(S.UA['ie']) {
				if(S.UA['ie'] == 9) {
					zoomPer = '-ms-transform';
				} else {
					zoomPer = 'zoom';
					undefinedPer = 'normal';
				}
			}
			else {
				zoomPer = '-webkit-transform';
			}
			
			// 获得el所在的第一级zoom父元素的zoom值及该父元素left/top偏移量。
			var zoomArgs = $(el).parents().map(
				function(index, el) {
					if($(el).css(zoomPer) != undefinedPer) {
						var ret;
						if(S.UA['ie'] && S.UA['ie']<9) {
							ret = {
								value : el.style.zoom || -1,
								top : $(el).offset().top + $(el).children().first().offset().top,
								left : $(el).offset().left + $(el).children().first().offset().left
							};
						} else {
							var temp = $(el).css(zoomPer),
								start = temp.indexOf('(') + 1,
								end = temp.indexOf(',');
							ret = {
								value : temp.substring(start, end) || -1,
								top : $(el).offset().top + $(el).children().first().offset().top,
								left : $(el).offset().left + $(el).children().first().offset().left
							};
						}
						return ret;
					}
				}
			).get(0);
			return zoomArgs;
		}

分享到:
评论

相关推荐

    js精确定位HTML标签的TOP和LEFT值

    本文将介绍一种兼容性较好的方法,通过JavaScript函数来获取指定元素的`top`和`left`坐标。 #### 获取元素位置的JavaScript函数 ```javascript function getElementPos(elementId) { var ua = navigator....

    vue el-tree 默认展开第一个节点的实现代码

    该属性可以绑定一个数组,数组中的元素对应需要展开的节点的id值。 5. 实例化与数据绑定:通过Vue组件的data属性返回一个对象,该对象包含初始化树形数据(treeData)和定义展开节点id的数组(treeExpandData)。在...

    Javascript中找到子元素在父元素内相对位置的代码

    2. 如果元素及其父节点条件满足,计算子元素相对于父元素的位置。这一步通过比较子元素的 `offsetTop` 属性和父元素的 `offsetTop` 属性来实现。`offsetTop` 是一个只读属性,它返回当前元素相对于其包含块顶部的...

    el-select获取选中的label值.pdf

    在Vue.js框架中,Element UI库提供了一个丰富的组件集,其中`el-select`是一个常用的下拉选择组件。在处理用户交互时,有时我们需要获取选中项的`label`或`value`值。从提供的信息来看,这里介绍的是如何在不通过...

    offset:获取文档中元素的偏移量

    获取文档中 DOM 元素或范围的偏移量。 安装 $ npm install document-offset : $ component install timoxley/offset 应用程序接口 偏移量(el) 获取文档中元素的偏移量(相对于文档的左上角)。 例子: var ...

    EL3204测量偏移处理及EL3154测量波动处理.docx

    **EL3204测量偏移处理** EL3204是倍福(Beckhoff)公司的模拟输入模块,主要用于测量热电阻(如RT100)等温度传感器的信号。在实际应用中,部分用户反馈EL3204测量RT100传感器时存在温度偏高的现象,偏差大约在2~3...

    在自定义spring aop中使用el获取拦截方法的变量值。

    标题中的“在自定义Spring AOP中使用EL获取拦截方法的变量值”指的是在Spring的面向切面编程(AOP)中,通过Expression Language(EL,表达式语言)来访问被拦截方法的局部变量值。这通常涉及到Spring的代理机制、...

    javax.el-api.jar/javax.el.jar

    在Java世界中,EL(Expression Language)是一种强大的脚本语言,用于在JSP(JavaServer Pages)和其他Java EE组件中简化数据访问和方法调用。它允许开发者通过简洁的表达式来访问Java对象的属性和调用方法,而无需...

    jspEL表达式和el

    JSP Expression Language,简称EL,是JavaServer Pages(JSP)2.0版本引入的一种轻量级的表达式语言,用于在JSP页面中方便地访问JavaBean属性和其它Java对象。EL的目标是简化JSP中的脚本元素,提高开发效率,使...

    EL手册 EL手册 EL手册

    《EL手册》是关于EL(Expression Language)的详尽指南,它是Java EE应用程序开发中的一个重要组成部分,主要用于在JSP(JavaServer Pages)和其他Java web组件中进行数据绑定和表达式处理。EL语言的设计目的是简化...

    表达式语言(EL) el表达式

    在JavaServer Pages (JSP) 2.0版本中引入了一项重要的新特性,即表达式语言(EL),它极大地简化了在JSP页面中访问JavaBean属性和表达式求值的方式。EL提供了一种简洁、易于阅读的语法,使得开发者可以更高效地处理...

    EL表达式练习 EL表达式练习

    EL(Expression Language,表达式语言)是JavaServer Pages(JSP)2.0及更高版本中的一个重要组成部分,它提供了一种简洁、强大的方式来访问JavaBean属性和表达式求值。EL表达式主要用于简化JSP页面中的代码,提高...

    javascript获得对象的坐标

    `getBoundingClientRect()` 方法是获取元素坐标最常用的方式之一,它返回一个对象,该对象包含了元素相对于视口的位置信息,包括顶部、底部、左侧和右侧的距离等。 ```javascript function getElementPos(elementId...

    EL表达式学习资料

    这里 `${username}` 就是一个 EL 表达式,它表示输出当前作用域中的 `username` 变量的值。 2. **使用方式** EL 表达式可以在 JSP 页面中的 HTML 和 JSP 标签内使用。主要有以下几种使用方式: - **属性值中...

    EL,jstl,js 对select元素

    在Web开发中,选择框(`&lt;select&gt;`元素)经常用于创建下拉菜单,让用户从预定义的选项中做出选择。EL(Expression Language)、JSTL(JavaServer Pages Standard Tag Library)和JavaScript都是处理此类任务的重要...

    el-table合并列 合并单元格

    el-element中el-table合并单元格 合并列。无限制列合并。通过循环数据源数据获取该列需要合并的行数。

    EL 表达式 EL-Java

    同样,当在MVC设计模式下,从Servlet传递数据到JSP时,使用`setAttribute()`存储数据,然后在JSP中使用`getAttribute()`获取,EL可以简化这一过程,如`${requestScope.username}`就能直接获取到对应的值,如果值为...

    el-api.jar el-ri.jar

    EL是一种轻量级的脚本语言,它允许开发者在JSP、JSF等Web应用中以简洁的方式访问和操作JavaBean属性或其他Java对象。EL表达式通常以"$"或"#”开头,如`${variable}`或`${bean.property}`。它提供了简化的语法来获取...

    jsp el表达式详解

    JavaServer Pages (JSP) Expression Language(EL)是JSP 2.0及更高版本中引入的一种轻量级、简洁的脚本语言,用于简化在JSP页面中访问JavaBean属性和其他Java对象的流程。EL表达式主要用于替代繁琐的JSP脚本和JSP...

Global site tag (gtag.js) - Google Analytics