ie10兼容问题:

将div定位absolute在图片img上面,发现div若不加背景色,导致div点击事件(任何事件)无效。

<div class="paper-box">
<div class="red-paper">
<img class="company-uk-packet" src="./images/uk-bag.png" alt="">
</div>
<div class="hand-hot"></div>
</div>

解决办法:

1、给div本身加透明背景色(前提是该div里没有内容,否则内容也会被透明)

.hand-hot{
position: absolute;
width:220px;
height: 54px;
bottom:22px;
left:102px;
cursor: pointer;
background: #fff;
opacity: ;
}

2、将img换成背景图

.red-paper{
width:430px;
height: 430px;
background: url('../images/uk-bag.png') no-repeat center center;
}
.hand-hot{
position: absolute;
width:220px;
height: 54px;
bottom:22px;
left:102px;
cursor: pointer;
}

ie10兼容问题 -- 将div定位absolute在图片img上面,导致div点击事件无效的更多相关文章

  1. 部分iphone手机上的div的点击事件无效

    最近在做一个手机移动端的项目,Andrio手机和部分iphone手机上点击事件都是好的,只有在老的型号上的iphone手机上点击事件无效果. 后来在网上查了很多资料,发现有加样式cursor:poin ...

  2. absolute 导致点击事件无效

    方案一: 添加层数 z-index 方案二: 背景的透明度为0 background-color:#000; filter:alpha(opacity=0); opacity:0;

  3. IE DIV背景透明,点击事件不响应解决方案

    IE DIV背景透明,给DIV绑定点击事件, 当点击DIV时,不会响应已经绑定的点击事件. 解决方案是给DIV的设置以下样式. background-image: url(data:image/gif ...

  4. div定位relative和absolute测试1

    div里的position定位也是比较常见的,relative是相对定位,absolute是绝对定位.如本文测试:body自带8px的margin,这里不对其进行清空.蓝色的div和红色的div分别设 ...

  5. div定位relative和absolute测试2

    之前的博文:div定位relative和absolute测试1.中,body包含了蓝色和红色div,蓝色的相对定位,相对于body向下偏移了10px位置,红色绝对定位,相对浏览器偏移了10px位置. ...

  6. div定位relative和absolute和float测试3

    position等于absolute的时候,不一定是相对于浏览器定位,当div存在包含关系时,父div设置成relative,其中包含的div设置成absolute就是相对于该父div的了.该文测试了 ...

  7. 网页制作过程中div定位的三个问题

    这几天要做单位的网站,对于做网站我也不怎么样,于是我便在网上参考了一个比较满意的网站,套一下来把这个工作结束了.在此期间遇到了三个关于div定位问题, 一般网站用div布局时都是从上到下分head . ...

  8. html中div定位练习

    html中div定位练习,实现简单的计划列表: 记录div定位时主要的属性:float.position等,以及对应的relative和absolute等,同时使用到angular js中的数据绑定, ...

  9. div定位

    1.float定位带来的问题<html> <head> <title>div浮动引发的问题</title> </head> <styl ...

随机推荐

  1. 基本的axios用法

    首先安装axios: 1):npm install 2):npm install vue-axios --save 3):npm install qs.js --save //它的作用是能把json格 ...

  2. 【Django】搭建Django administration并登录

    Python自带一个后台管理系统,这个后台管理系统搭建与登陆呢? 新建项目Django_Admin 文件结构目录如下: 创建APP 在pycharm下方的terminal终端中输入命令: python ...

  3. final修饰的类,其属性和方法默认是被final修饰的吗?

    在论坛上,看到一个问题,当然,各位聪明的客官想必已经知道问题是什么了,嘿嘿,没错就是文章的标题:final修饰的类,其属性和方法默认是被final修饰的吗? 老实说,刚开始看到这个问题的时候,有点懵. ...

  4. 白鹭http请求post

    示例demo: //new http请求 var request = new egret.HttpRequest(); //请求参数 var params = "p1=postP1& ...

  5. 第五周课程总结&试验报告

    this和super的区别 区别点 this super 属性访问 访问同类中的属性,如果本类没有此属性则从父类中继续查找 访问父类中的属性 方法 访问本类中的方法,如果本类中没有此方法,则从父类中继 ...

  6. laravel中model类中好用的方法

    public function field() { return $this->belongsTo(HrmAuthFieldsModel::class, 'filed_id', 'id'); } ...

  7. Linux驱动开发8——中断处理

    中断包括软中断和硬中断两种,中断是一种异步I/O机制,即中断可以发生在任意时间点. 1.硬中断 硬件中断包括触发中断和处理中断两部分,而维系两者的是中断号,中断号是一种硬件资源. 1.1.注册和释放中 ...

  8. WPF DevExpress Chart控件 界面绑定数据源,不通过C#代码进行绑定

    <Grid x:Name="myGrid" Loaded="Grid_Loaded" DataContext="{Binding PartOne ...

  9. spring几种获取 HttpServletRequest 对象的方式

    以下的 request 实例都编号了,一共 4 种 方式 1.@Autowired 方式2.public void Test(HttpServletRequest request1, HttpServ ...

  10. 【Linux 应用编程】进程管理 - 进程、线程和程序

    基本概念 程序和进程的区别 程序是平台相关的二进制文件,只占用磁盘空间.编写完程序代码后,编译为可执行的二进制文件即可. 进程是运行中的程序,占用 CPU.内存等系统资源. 通过 Shell 命令,可 ...