随笔分类 -  移动端

解决移动端Safari :active伪类设置失效问题
摘要：在body元素中添加如下代码 <body ontouchstart="" onmouseover=""> </body> 亲测有效。 阅读全文
posted @ 2020-11-10 17:56 承蒙时光 阅读(256) 评论(0) 推荐(0)
原生js实现一个侧滑删除取消组件（item slide）
摘要：组件，本质上是解决某个问题封装的类，在此记录原生js实现侧滑删除 先上效果图 实现思路 1. 确定渲染的数据结构 2. 思考划分布局，总的有两个主要的模块：内容区域和按钮区域 2.1 内容区域保持宽度永远占满设备的宽度 2.2 内容区域和按钮区域之和的宽度等于每一行item的总宽度 3. 每行超出的 阅读全文
posted @ 2019-06-10 17:02 承蒙时光 阅读(911) 评论(1) 推荐(1)
移动端与H5页面像素的差异与关系
摘要：最近工作任务主要是移动端内嵌H5页面，一次与原生进行像素交互下，发现了这个天坑，再次做个记录📝 天坑如下： H5页面中的“像素”与移动端设备的“像素”系统不一致，对于刚接触这块的我，曾经几时在还没有遇到过这样的情况下，去看相关的文章一点体会也没有，这次碰上了，然后又重新看了一遍，对这块的理解也能比 阅读全文
posted @ 2019-05-16 10:27 承蒙时光 阅读(1639) 评论(1) 推荐(1)
结合webpack 一步一步实现懒加载的国际化简易版方案
摘要：想法来源于工作需求，最后倒腾出一个国际化工作流，期望是这样的： 1. 自动化处理国际化文案（表现为转义翻译人员给到的文件处理成技术人员所识别的文件） 2. 转化后的国际化文件能够按需加载，实现懒加载的功能 综上，实现以上需求所涉及知识点：nodejs, webpack 本文只记录文件实现懒加载功能， 阅读全文
posted @ 2019-04-28 18:46 承蒙时光 阅读(1015) 评论(0) 推荐(0)
SEO优化之——hreflang（多语言网站优化）
摘要：用法格式 更对的语言对照表请访问： https://baike.baidu.com/item/ISO%20639-1 使用场景 在不同的网站上（除了显示的语言不同之外都相同）这种有跨国网站，一般情况下会对应很多语言的版本，每个版本的的路径可以是同域，也可以是跨域，在所有版本中都加入所有语言版本对应的 阅读全文
posted @ 2018-07-31 14:48 承蒙时光 阅读(2127) 评论(0) 推荐(0)
SEO优化之——rel=canonical(整合重复页)
摘要：用法一 如图所示 有三个页面，三个页面的访问路径都不一样，但是现实的内容page2和page3显示的内容和page1一样，这时候在三个page中分别都加入了<link res="canonical" href="url" /> ，可以注意到page3和page2页面的url都指向了page1的访问路 阅读全文
posted @ 2018-07-31 14:40 承蒙时光 阅读(313) 评论(0) 推荐(0)
一次偶然的点开一盏灯引发的SEO初识
摘要：事情是这样，不小心点开了dev tools的审计（audits）面板，点开了灯之后，画风如下 emmm, SEO 跑了满分也，好奇宝宝就往下滚到SEO区域，发现了如下新大陆 嗯，原来是应用满足了打钩的几项标准，细心的你们一定看到了有个rel=canonical没有满足，为什么呢，下面会讲到，那么我们 阅读全文
posted @ 2018-07-31 14:25 承蒙时光 阅读(266) 评论(0) 推荐(0)
由一次动态改变font-size的大小引申的一系列困惑补录
摘要：以下结论如有错误，欢迎指正 在切入正题之前，先了解下window 和document这两个大对象 我们熟知 JavaScript的组成如下图所示： window对象和document对象分别属于哪个分支下面呢？ 发现： 在控制台打印出的document对象和window.document打印出来的对 阅读全文
posted @ 2018-07-30 18:14 承蒙时光 阅读(550) 评论(0) 推荐(0)