最近在做的项目用了Framework7前端框架，功能确实比较强大！但这两天遇到一个坑，希望我的这点收获能给遇到这个问题的朋友一点帮助。

在使用Photo Browser 的时候，图片下方想放一个“点赞”的按钮，耐何就死活无法响应鼠标的点击事件(click tap都不行)。怀疑被父级元素拦截了，反复各种折腾就是没效果！

最后都要放弃的时候，都准备移除“点赞”功能了，无意中发现.photo-browser-captions这个层有个样式是 pointer-events: none; 翻了一下CSS手册，说none时元素永远不会成为鼠标事件的target！

这一下子就找到症结所在了！改为 pointer-events: auto; 就能正确绑定事件了！

真没想到CSS也能控制鼠标事件，涨姿势了！

踩到Framework7 Photo Browser 的一个坑的更多相关文章

  1. php项目踩到的empty函数的一个坑

    报错信息: PHP Fatal error: Can't use function return value in write context in /目录省略.../XXService.php on ...

  2. 使用ffmpeg视频编码过程中踩的一个坑

           今天说说使用ffmpeg在写视频编码程序中踩的一个坑,这个坑让我花了好多时间,回头想想,非常多时候一旦思维定势真的挺难突破的.以下是不对的编码结果:                   ...

  3. 【转】最近用Timer踩了一个坑，分享一下避免别人继续踩

    [转]最近用Timer踩了一个坑,分享一下避免别人继续踩 最近做一个小项目,项目中有一个定时服务,需要向对方定时发送数据,时间间隔是1.5s,然后就想到了用C#的Timer类,我们知道Timer 确实 ...

  4. 记新人从 excel 文件中读取字典数据踩的一个坑

    原本是打算今天分享一下最近学习接口自动化的心得体会,然而在我写模板的时候,却被一个坑拦我大半天,心得体会不得不 延期再分享了.在我无数次调试无数次看log,终于发现并解决这个问题了.下面记录一下踩的坑 ...

  5. 用html5的视频元素所遇到的第一个坑

    html5 有一个video标签,这个是被大家所熟知的事情.按照w3c的规范,我认真的写出如下代码: <video preload="auto" controls=" ...

  6. MySQL字符集的一个坑

    MySQL字符集的一个坑 http://imysql.com/2013/10/29/misunderstand-about-charset-handshake.shtml MySQL字符集的一个坑 1 ...

  7. mongodb count 导致不正确的数量（mongodb count 一个坑）

    在mongodb 集群中,if  存在orphaned documents 和chunk migration, count查询可能会导致一个不正确的查询结果,例如我就是踩的这个坑,先不说话,看结果: ...

  8. 记录我开发工作中遇到HTTP跨域和OPTION请求的一个坑

    我通过这篇文章把今天工作中遇到的HTTP跨域和OPTION请求的一个坑记录下来. 场景是我需要在部署在域名a的Web应用里用JavaScript去消费一个部署在域名b的服务器上的服务.域名b上的服务也 ...

  9. guava缓存批量获取的一个坑

    摘要 Guava Cache是Google开源的Java工具集库Guava里的一款缓存工具,一直觉得使用起来比较简单,没想到这次居然还踩了一个坑 背景 功能需求抽象出来很简单,就是将数据库的查询sth ...

随机推荐

  1. Java中的字符集

    Java中的字符集 1.字符集概述 字符集是各国家文字与字符编码对照表.字符可以看成是计算机中展示的图案效果,每个字符集都对每一种图案进行编码,有着一对一的对应关系.因此进行字符输出时,都需要指定使用 ...

  2. Python-Django框架学习笔记——第一课：Hello World

    Python Django 有诗云: 孤山寺北贾亭西,水面初平云脚低. 几处早莺争暖树,谁家新燕啄春泥. 乱花渐欲迷人眼,浅草才能没马蹄. 最爱湖东行不足,绿杨阴里白沙堤. 今天在信阳游玩,有幸来到信 ...

  3. IOS 音频的 使用说明

    说明 ● 简单来说,音频可以分为2种 ● 音效 • 又称“短音频”,通常在程序中的播放时长为1~2秒 • 在应用程序中起到点缀效果,提升整体用户体验 ● 音乐 • 比如游戏中的“背景音乐”,一般播放时 ...

  4. POJ-2029 Get Many Persimmon Trees---二维树状数组+枚举

    题目链接: https://vjudge.net/problem/POJ-2029 题目大意: 有N棵树在一个n*m的田里,给出每颗树的坐标 用一个s*t的矩形去围,最多能围几棵树 思路: 用二维树状 ...

  5. ssh-copy-id: INFO: attempting to log in with the new key(s), to filter out any that are already installed /usr/bin/ssh-copy-id

    远程删除key ssh-keygen -f "~/.ssh/known_hosts" -R 192.168.0.34 如果还是不可以,通过 ssh-keygen 重新生成key

  6. nbu备份虚拟机报错156状态4207

    VMware Backup getting snapshot error encountered (156)and status: 4207: Could not fetch snapshot met ...

  7. 在使用HTMLTestRunner时，报告为空，错误提示<_io.TextIOWrapper name='<stderr>' mode='w' encoding='utf_8'>

    <_io.TextIOWrapper name='<stderr>' mode='w' encoding='utf_8'> Time Elapsed: 0:00:21.3163 ...

  8. Git版本控制的原理

    Git工作区域 工作目录(Working Directory) 暂存区(Stage/Index) 资源库(Repository或Git Directory) 远程的git仓库(Remote Direc ...

  9. 曲率（Curvature）

    原文链接 几何体的曲率对于不同的对象有不同的定义.首先来看最简单的平面曲线. 首先把曲线分成无穷小的小段,每一段看作某个圆的一小段圆弧.这个圆叫做“密切圆”(Osculating Circle).由于 ...

  10. 前端JavaScript之DOM使用案例

    1.弹出框点击关闭 (这个例子关键自己创建标签以及属性,不是太好想啊,而且作用相对来数也不是太大) <!DOCTYPE html> <html> <head> &l ...