获得徽章 0
你的爱情信号满格了吗,使用:nth-child()和变量绘制信号彩带
不要小看这个动画喔,34行CSS代码,巧妙运用到以下知识点BFC+CSS变量遍历+CSS变量组合计算+滤镜色相旋转+反向动画+Flexbox底部基线对齐
线上演示:
codepen.io
更多CSS骚操作:
juejin.im
展开633- 3146
- amis 现在已经正式开源啦!🥳
🎊,
地址:github.com
直接通过 JSON 即可配置出完整的MIS系统,致力于解放业务中各类枯燥乏味的数据增删改查功能的前端开发工作,旨在打造通用MIS平台,彻底释放前后端人力的强大工具!
百度内部已接入100+部门,创建页面1.2w+,每天活跃页面1.8k活跃群组300+
;平台去年也支持了春晚红包的策略配置活动;目前已有基于amis渲染器成功搭建的若干个百度智能云产品
具有拖拽可视化编辑页面功能的MIS平台不久也会对外公开亮相
下图是amis开发者在QCon分享的PPT,大家也可以在github.com 下载查看PPT全文
展开4190 - 在移动端 click 有 300ms 延迟,是safari为了判断是否是双击事件而设计,浏览器要知道你是不是要双击操作以判断是否进行缩放
方案一: 禁用缩放
<meta name="viewport" content="user-scalable=no">
<meta name="viewport" content="initial-scale=1,maximum-scale=1">
缺点: 使得双指手势缩放也无效了
方案二: 更改浏览器视口宽度为设备宽度
如果设置了下述meta标签,那浏览器就可以认为该网站已经对移动端做过了适配和优化,就无需双击缩放操作了。
<meta name="viewport" content="width=device-width">
方案三:使用css属性touch-action
这个属性指定了相应元素上能够触发的用户代理(也就是浏览器)的默认行为。将属性值设为none,则不触发浏览器的默认行为。
缺点:支持程度低
方案四:模拟click事件
根据浏览器事件触发顺序:
touchstart --> touchmove --> touchend --> mouseover(有的浏览器没有实现) --> mousemove -->mousedown --> mouseup --> click
可以通过监测touchend事件,阻止原生click事件,模拟click事件并发出。展开533 - openmct NASA(美国国家航空航天局)开源的下一代任务控制框架,能将桌面端与移动端的设备数据可视化,在线体验:
openmct-demo.herokuapp.com GitHub 地址:
github.com
评论21 - 评论22
- D2 日报 2019年3月8日
* 官网:daily.fairyever.com
* 掘金:juejin.im
今日 14 条分享:
- [新闻] x 1
- [开源项目] x 6
- [分享] x 3
- [网站] x 2
- [工具] x 2
* 提交你的链接到日报:daily.fairyever.com
D2 日报是开源组织 D2 Projects 下的一个公益新闻类开源项目。
宗旨是一切资源免费且开源,但是希望每个人既是读者也是分享者,如果有足够的能力,你也可以成为开发者。
请在每天闲(mo)暇(yu)时光享受日报带来的丰富知识,也请在自己发现优质资源时随手分享给大家。展开37