ie8下jquery读取当前点击的标签位置错误,原因是里面有内容写了text-indent:-9999px
今天写一地图的效果,鼠标点击对应的区域,弹出所点击区域的名字。
因为设计的区域名字有特殊效果,所以,在点击区域里面套了个标签写上区域名字用来识别,但是这个文字呢不同显示在页面上,所以就给 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>
ie8下jquery读取当前点击的标签位置错误,原因是里面有内容写了text-indent:-9999px的更多相关文章
- jquery如何实现点击LI标签和下面的LI互换顺序? 超简单代码
转: jquery如何实现点击LI标签和下面的LI互换顺序? 上面的效果涉及jquery的两个方法: next() : 获得匹配元素集合中每个元素紧邻的下一个同胞元素. after() :在被选元 ...
- 使用JS或jQuery模拟鼠标点击a标签事件代码
原文 使用JS或jQuery模拟鼠标点击a标签事件代码 这篇文章主要介绍了使用JS或jQuery模拟鼠标点击a标签事件代码,需要的朋友可以参考下 <a id="alink" ...
- IE8下JQuery clone 出的select元素使用append添加option异常解决记录
遇到一个怪现象,由于配置参数是多实例的, 故采用JQuery对模板HTML代码进行clone, HTML代码中包括select标签, 在克隆之后需要对select进行添加option. 在firefo ...
- ie8下jquery改变PNG的opacity出现黑边,ie6下png透明解决办法
目前互联网对于网页效果要求越来越高,不可避免的用到PNG图片,PNG分为几种格 式,PNG8 PNG24 PNG32,其中最常用的,也是显示效果和大小比较适中的则是PNG24,支持半透明,透明,颜色也 ...
- ie8下jquery改变PNG的opacity出现黑边
复制网上的,没有他们那个类型的博客,所以就直接复制了 这些天在做一个效果,鼠标经过,PNG图片由透明变成不透明,jquery代 码:$(element).animate({"opacity& ...
- bootstrap面包屑在ie8下显示重叠,鼠标点击显示效果正常
ie8下加载后的显示 点击之后的显示 主要是li标签宽度auto引起的,可以设置li标签的最小宽度 <ol class="breadcrumb"> <li id= ...
- 使用jQuery模拟鼠标点击a标签事件
来源于:https://mo2g.com/view/42/ <html> <head> <meta charset="UTF-8"> <t ...
- IE8下jQuery改变png图片透明度时出现的黑边问题
png24格式的图片在用jQuery添加显示隐藏动画时发现,图片的半透明区域出现黑边? 在网上搜了搜主要有以下几种办法: 1.把图片保存成PNG-8格式. 2.把背景色一起切入并保存为JPG格式. 以 ...
- jquery怎么在点击li标签之后添加一个在class,点击下一个li时删除上一个class?
思路:点击当前li元素后是用removeClass()删除所有兄弟元素(使用siblings()获取)的class样式,然后使用addClass()为当前li添加class. 具体演示如下: 1.HT ...
随机推荐
- Android 读取手机短信
获取android手机短信需要在AndroidManifest.xml加权限: <uses-permission android:name="android.permission.RE ...
- How to save/read file on different platforms
You can use standard c functions, such as fopen, fwrite, to save and read file on different platform ...
- SpringMVC——项目启动时从数据库查询数据
SpringMVC项目中遇到这样的问题: 1.很多数据字典需要从数据库中查询: 2.懒得修改SQL语句: 3.想在项目中声明静态变量存储数据字典,但是希望这个字典可以在项目启动时进行加载. 当遇到这样 ...
- 集合练习——Set部分
我们知道list存储的是有序不唯一的元素. set存储的是无序唯一的元素. 那么下面看一个例子吧: package CollectionPart; import java.util.HashSet; ...
- ls -l命令详解
输入: ls -l 输出: -rwxr-xr-x root root May : b 第一个字段(1个字符):文件类型 - :普通文件 d:目录文件 b:块设备文件(block) c:字符设备文件(c ...
- Java并发——同步容器与并发容器
同步容器类 早期版本的JDK提供的同步容器类为Vector和Hashtable,JDK1.2 提供了Collections.synchronizedXxx等工程方法,将普通的容器继续包装.对每个共有方 ...
- Unity3D 之UGUI 滑动条(Slider)
这里来讲解下UGUI 滑动条(Slider)的用法 控件下面有三个游戏对象 Background -->背景 Fill Area --> 前景区域 Handle Slide Area -- ...
- CSS3兼容IE的大杀器
经过长久以来的不懈努力,我终于成功的将selectivizr与PIE这两个解决css3的利器进行了深度的整合,大大降低了使用难度 <!--[if lte IE 9]><script ...
- 从URI中获取实际的文件path
如题,经常用在onActivityResult方法中解析图片等各种地址,因为Android 4.4之后google更改了对应的方法. /** * Get a file path from a Uri. ...
- Dapper.NET - ORM(ibatis.Net)
Dapper.NET使用 1.为什么选择Dapper 2.以Dapper(4.0)为例. 2.1 在数据库中建立几张表. 2.2实体类. 3.使用方法 3.1 一对一映射 3.2 一对多映射 3.3 ...