今天写一地图的效果,鼠标点击对应的区域,弹出所点击区域的名字。

因为设计的区域名字有特殊效果,所以,在点击区域里面套了个标签写上区域名字用来识别,但是这个文字呢不同显示在页面上,所以就给 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的更多相关文章

  1. jquery如何实现点击LI标签和下面的LI互换顺序? 超简单代码

    转: jquery如何实现点击LI标签和下面的LI互换顺序? 上面的效果涉及jquery的两个方法: next()  :  获得匹配元素集合中每个元素紧邻的下一个同胞元素. after() :在被选元 ...

  2. 使用JS或jQuery模拟鼠标点击a标签事件代码

    原文 使用JS或jQuery模拟鼠标点击a标签事件代码 这篇文章主要介绍了使用JS或jQuery模拟鼠标点击a标签事件代码,需要的朋友可以参考下 <a id="alink" ...

  3. IE8下JQuery clone 出的select元素使用append添加option异常解决记录

    遇到一个怪现象,由于配置参数是多实例的, 故采用JQuery对模板HTML代码进行clone, HTML代码中包括select标签, 在克隆之后需要对select进行添加option. 在firefo ...

  4. ie8下jquery改变PNG的opacity出现黑边,ie6下png透明解决办法

    目前互联网对于网页效果要求越来越高,不可避免的用到PNG图片,PNG分为几种格 式,PNG8 PNG24 PNG32,其中最常用的,也是显示效果和大小比较适中的则是PNG24,支持半透明,透明,颜色也 ...

  5. ie8下jquery改变PNG的opacity出现黑边

    复制网上的,没有他们那个类型的博客,所以就直接复制了 这些天在做一个效果,鼠标经过,PNG图片由透明变成不透明,jquery代 码:$(element).animate({"opacity& ...

  6. bootstrap面包屑在ie8下显示重叠,鼠标点击显示效果正常

    ie8下加载后的显示 点击之后的显示 主要是li标签宽度auto引起的,可以设置li标签的最小宽度 <ol class="breadcrumb"> <li id= ...

  7. 使用jQuery模拟鼠标点击a标签事件

    来源于:https://mo2g.com/view/42/ <html> <head> <meta charset="UTF-8"> <t ...

  8. IE8下jQuery改变png图片透明度时出现的黑边问题

    png24格式的图片在用jQuery添加显示隐藏动画时发现,图片的半透明区域出现黑边? 在网上搜了搜主要有以下几种办法: 1.把图片保存成PNG-8格式. 2.把背景色一起切入并保存为JPG格式. 以 ...

  9. jquery怎么在点击li标签之后添加一个在class,点击下一个li时删除上一个class?

    思路:点击当前li元素后是用removeClass()删除所有兄弟元素(使用siblings()获取)的class样式,然后使用addClass()为当前li添加class. 具体演示如下: 1.HT ...

随机推荐

  1. 各种会义PPT

    http://vdisk.weibo.com/s/dBzv2siaHK2H http://vdisk.weibo.com/wap/u/3460619722 https://yunqi.aliyun.c ...

  2. mongo数据管理java简易版

    mongo是搭建在局域网服务器上的,处理起来比较麻烦,于是自己写了个简单的处理工具. 如果有对java操作mongo不太了解的也可以在这里看下简单的示例. 只有增删改查的功能,而且只支持json格式的 ...

  3. Java基础知识强化之IO流笔记46:IO流练习之 把文本文件中数据存储到集合中的案例

    1.  把文本文件中数据存储到集合中      需求:从文本文件中读取数据(每一行为一个字符串数据)到集合中,并遍历集合. 分析:      通过题目的意思我们可以知道如下的一些内容,      数据 ...

  4. 《app研发录》第一章 重构,夜未眠笔记

    1.1 重新规划android的项目结构     重新规划android的目录结构分两步: 1.建立AndroidLib类库,将与业务无关的逻辑转移到AndroidLib. acitivity存放的是 ...

  5. iOS之GCDAsyncSocket第三方库的使用

    Socket描述了一个IP.端口对.它简化了程序员的操作,知道对方的IP以及PORT就可以给对方发送消息,再由服务器端来处理发送的这些消息.所以,Socket一定包含了通信的双发,即客户端(Clien ...

  6. 迭代器模式(Iterator Pattern)

    迭代器模式定义:Iterator Pattern提供一种方法顺序访问一个聚合元素中的各个元素,而又不暴漏内部方法 酒吧提供beer和wine: public class Bar { private L ...

  7. ffmpeg之YUYV转RGB ARM使用流程分析

    本例基于3.2.2 ffmpeg 一.应用调用API 二.头文件包含的API接口 对应于libswscale.so.libswscale.so.4.libswscale.so.4.2.100中 sws ...

  8. RabbitMQ 原文译06--Remote procedure call(RPC)

    在第三篇文章中, 我们学习了怎么使用队列在多了消息消费者当中进行耗时任务轮询. 但是如果我们想要在远程电脑上运行一个方法,然后等待其执行结果,这就是一个不同的场景,这种就是我们一般讲的RPC(远程过程 ...

  9. Win10 10586 更新

    最近发现,电脑c盘突然少了许多,发现c盘多了个windowsBT文件夹,大概6个G,恩,win10 又推出更新了,版本10586. 不知道为啥,更新时win10 把原来的下载的删除了,大概出了什么错误 ...

  10. Deep Learning 学习随记(三)续 Softmax regression练习

    上一篇讲的Softmax regression,当时时间不够,没把练习做完.这几天学车有点累,又特别想动动手自己写写matlab代码 所以等到了现在,这篇文章就当做上一篇的续吧. 回顾: 上一篇最后给 ...