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

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

      ACE 5.6下载地址:http://download.dre.vanderbilt.edu/ 方法一: 1. 解开ACE-install.sh文件    tar –zxvf ACE-5.6.ta ...

  2. 动作-CCActionInterval之CCActionEase家族

    补间动作也是一个包装器(之前叫补间动画,从字面上讲,叫动作更合适一些.).你也可以叫他缓释动作. 1.含义 补间动作改变的是,内部动作的执行速率(注意,并没有改变执行的最终效果,和执行的时间.)关于这 ...

  3. Linux新手入门:通过chmod改变文件权限--转

    前面介绍过在Linux中如何查看文件的属性,在Linux文件权限详解中我们介绍了Linux文件的三种身份和四种权限,三种身份分别为: u:文件的拥有者 g:文件所属的群组 o:其他用户 对于每个身份, ...

  4. The Tangled Web (Web之困)第四章 摘要

    1. HTML语法: 由Tag组成层级结构,标签视为名,而值插在当中. 关键组成符:<, >, ', ", & 2. 解析模式: 文件开头<!DOCTYPE> ...

  5. 瀑布流AJAX无刷新加载数据列表--当页面滚动到Id时再继续加载数据

    瀑布流加载显示数据,在当下已经用的很普遍,尤其是我们在做网上商城时,在产品列表页面已经被普遍使用. 对于实现瀑布流布局的解决方案主要有以下两种方式: 1.对每一条显示数据使用绝对定位+浮动的方式,这样 ...

  6. Docker container network configuration

    http://xmodulo.com/networking-between-docker-containers.html How to set up networking between Docker ...

  7. java.lang.NoClassDefFoundError: com.nostra13.universalimageloader.core.DisplayImageOptions$Builder

    今天在使用Universal-image-loader开源插件的时候,一直出现了这么个错误.原因是在ADT22版本中导入jar包的方式不对. 正确的导入jar包方式: 在adt17的版本之后,导入第三 ...

  8. SQLServer2012分离出的数据库存放路径

    分离出的数据库没有保存位置提示,经常会导致分离出的数据库找不到  以下是分离出的数据库默认位置: C:\Program Files\Microsoft SQL Server\MSSQL11.MSSQL ...

  9. Apache+Tomcat +mod_proxy集群负载均衡及session

      序言: 在玩Apache+Tomcat +mod_jk集群负载均衡及session的时候发现,还有一种方式可以实现,就是网上各位大牛们说的mod_proxy反向代理. 实在弄的我的知识细胞洋洋.实 ...

  10. IOS开发之KVC与KVO简述

    KVC:Key-Value Coding KVO:Key-Value Observing Person.m #import <Foundation/Foundation.h> @inter ...