ie8下jquery读取当前点击的标签位置错误,原因是里面有内容写了text-indent:-9999px
2013-08-08 17:54
561 查看
今天写一地图的效果,鼠标点击对应的区域,弹出所点击区域的名字。
因为设计的区域名字有特殊效果,所以,在点击区域里面套了个标签写上区域名字用来识别,但是这个文字呢不同显示在页面上,所以就给 em 加个了display:block;text-indent:-9999px的样式。
用jquery var _index = $(this).index(); 获取当前点击的标签对应的名字时,发现在ie8每次获取的标签所在位置都不正确,其它浏览器都正常。百思不得其解,找了很长时间问题,发现,把 text-indent:-9999px样式去掉,这个问题解决了。
结论:text-indent:-9999px 这个样式谨慎使用。
<div class="map" id="map">
<div class="city"><span style="left:20px; top:18px;" class="full"><i></i></span><em class="name">新疆</em></div>
<div class="city"><span style="left:9px; top:22px;"><i></i></span><em class="name">西藏</em></div>
<div class="city"><span style="left:13px; top:14px;"><i></i></span><em class="name">青海</em></div>
<div class="city"><span style="left:3px; top:3px;"><i></i></span><em>内蒙古</em></div>
<div class="city"><span style="left:3px; top:3px;"><i></i></span><em>宁夏</em></div>
</div>
因为设计的区域名字有特殊效果,所以,在点击区域里面套了个标签写上区域名字用来识别,但是这个文字呢不同显示在页面上,所以就给 em 加个了display:block;text-indent:-9999px的样式。
用jquery var _index = $(this).index(); 获取当前点击的标签对应的名字时,发现在ie8每次获取的标签所在位置都不正确,其它浏览器都正常。百思不得其解,找了很长时间问题,发现,把 text-indent:-9999px样式去掉,这个问题解决了。
结论:text-indent:-9999px 这个样式谨慎使用。
<div class="map" id="map">
<div class="city"><span style="left:20px; top:18px;" class="full"><i></i></span><em class="name">新疆</em></div>
<div class="city"><span style="left:9px; top:22px;"><i></i></span><em class="name">西藏</em></div>
<div class="city"><span style="left:13px; top:14px;"><i></i></span><em class="name">青海</em></div>
<div class="city"><span style="left:3px; top:3px;"><i></i></span><em>内蒙古</em></div>
<div class="city"><span style="left:3px; top:3px;"><i></i></span><em>宁夏</em></div>
</div>
相关文章推荐
- 用A标签实现页面内容定位 点击链接跳到具体位置
- JQuery 获取多个select标签option的text内容(实例)
- jquery如何获取当前点击的标签下标
- JQuery 获取多个select标签option的text内容
- jQuery修改标签的text显示内容或value值
- jquery点击当前对象,并alert文本内容
- IE7部分标签(span、input )设置text-indent:-9999px后不在相应位置显示
- 关于用<fmt:message>标签读取springmvc配置的国际化资源文件显示为???key???的错误原因
- textbox.text被赋值后无法得到用户重新输入的内容--[低级错误忘记在 Page_Load()里面加if (!IsPostBack) ]
- jQuery实现点击后标记当前菜单位置(背景高亮菜单)效果
- jQuery获取标签里面的某个文本内容
- css:text-indent对img有影响,dl标签有border在ie中有bug
- jQuery获取当前鼠标相对位置坐标和点击图片跳转上一张或下一张功能
- UITableView延伸:点击cell关闭键盘,加载不同cell,监听里面的textfeild内容改变
- jquery怎么获取lable标签里面的内容?
- JQuery——获取当前点击元素的内容<This的用法>
- word文档内容读取检索 COM 类工厂中 CLSID 为 {000209FF-0000-0000-C000-000000000046} 的组件失败,原因是出现以下错误: 80070005 拒绝访问。
- IE7 部分标签设置text-indent:-9999px后不在相应位置显示的处理
- Jquery获取当前标签下的指定标签的内容
- TEXT文本编辑框4 点击按钮读取文本框内容到内表