09 2018 档案

浏览器插件检查
摘要：IE浏览器 标准浏览器 阅读全文
posted @ 2018-09-07 17:24 Janas 阅读(165) 评论(0) 推荐(0)
自定义事件
摘要：new Event方式 document.createEvent方式 阅读全文
posted @ 2018-09-07 16:56 Janas 阅读(131) 评论(0) 推荐(0)
JavaScript对象继承方式与优缺点
摘要：一、借助构造函数实现继承 子类构造函数中通过call执行父类构造函数并绑定this，可以实现私有属性的继承并且实例对象私有属性相互独立，缺点是无法继承父类的原型方法； 二、借助原型链实现继承 子类原型对象指向父类实例，父类私有属性与原型方法都可以继承，缺点一是修改原型对象引用类型数据的值会影响其他实 阅读全文
posted @ 2018-09-07 16:52 Janas 阅读(240) 评论(0) 推荐(0)
如何页面减少重绘回流
摘要：主要方法： 1. 直接改变className，如果动态改变样式，则使用cssText（考虑没有优化的浏览器） 2. 让要操作的元素进行”离线处理”，处理完后一起更新 3. 不要经常访问会引起浏览器flush队列的属性，如果你确实要访问，利用缓存 4. 让元素脱离动画流，减少回流的Render Tre 阅读全文
posted @ 2018-09-07 16:39 Janas 阅读(717) 评论(0) 推荐(0)
CSS3特效（3）——环形进度条
摘要：环形进度条 阅读全文
posted @ 2018-09-07 16:32 Janas 阅读(544) 评论(0) 推荐(0)
CSS3特效（2）——文字特效
摘要：文件发光渐变 文字描边外发光 文字渐变 阅读全文
posted @ 2018-09-07 16:30 Janas 阅读(437) 评论(0) 推荐(0)
CSS3特效（1）——loading效果
摘要：效果一： 效果二： 阅读全文
posted @ 2018-09-07 16:27 Janas 阅读(121) 评论(0) 推荐(0)
页面布局（5）——三栏自适应布局（左右定宽中间自适应）
摘要：三栏自适应布局（左右定宽中间自适应） 方式一：浮动 方式二：绝对定位 方式三：flexbox 方式四：表格样式 方式五：网格布局 方式六：calc计算宽度 阅读全文
posted @ 2018-09-07 16:09 Janas 阅读(185) 评论(0) 推荐(0)
页面布局（4）——居中
摘要：垂直居中 水平居中 水平垂直居中 阅读全文
posted @ 2018-09-07 16:04 Janas 阅读(134) 评论(0) 推荐(0)
页面布局（3）——多列定宽自适应
摘要：多列定宽自适应 阅读全文
posted @ 2018-09-07 16:03 Janas 阅读(176) 评论(0) 推荐(0)
页面布局（2）——多列等高布局
摘要：通过flex实现 通过table cell实现 通过正负margin、padding实现 阅读全文
posted @ 2018-09-07 15:52 Janas 阅读(195) 评论(0) 推荐(0)
页面布局（1）——全屏布局
摘要：全屏布局 flex 全屏布局 position 阅读全文
posted @ 2018-09-07 15:51 Janas 阅读(260) 评论(0) 推荐(0)
CSS特效（19）——鼠标悬浮内容自动撑开
摘要：鼠标悬浮内容自动撑开 阅读全文
posted @ 2018-09-07 15:40 Janas 阅读(488) 评论(0) 推荐(0)
CSS特效（17）——背景图混合模式 background-blend-mode
摘要：背景图混合模式 background blend mode 阅读全文
posted @ 2018-09-07 15:38 Janas 阅读(282) 评论(0) 推荐(0)
CSS特效（18）——背景色渐变+动画
摘要：背景色渐变+动画 阅读全文
posted @ 2018-09-07 15:38 Janas 阅读(2461) 评论(0) 推荐(0)
CSS特效（16）——美化radio、checkbox样式
摘要：美化radio、checkbox样式 阅读全文
posted @ 2018-09-07 15:37 Janas 阅读(287) 评论(0) 推荐(0)
CSS特效（15）——纯css实现导航栏下划线跟随动画
摘要：纯css实现导航栏下划线跟随动画 阅读全文
posted @ 2018-09-07 15:36 Janas 阅读(312) 评论(0) 推荐(0)
CSS特效（14）——纯 CSS 方式实现 CSS 动画的暂停与播放
摘要：纯 CSS 方式实现 CSS 动画的暂停与播放 阅读全文
posted @ 2018-09-07 15:35 Janas 阅读(206) 评论(0) 推荐(0)
CSS特效（13）——文字两端对齐
摘要：文字两端对齐 阅读全文
posted @ 2018-09-07 15:34 Janas 阅读(163) 评论(0) 推荐(0)
CSS特效（12）——文字下划波浪线
摘要：文字下划波浪线 阅读全文
posted @ 2018-09-07 15:32 Janas 阅读(2266) 评论(0) 推荐(0)
CSS特效（11）——按钮填充效果
摘要：按钮填充效果 阅读全文
posted @ 2018-09-07 15:22 Janas 阅读(491) 评论(0) 推荐(0)
CSS特效（10）——图片窥探效果
摘要：图片窥探效果 阅读全文
posted @ 2018-09-07 15:21 Janas 阅读(190) 评论(0) 推荐(0)
CSS特效（9）——图片倒影效果
摘要：图片倒影效果 阅读全文
posted @ 2018-09-07 15:20 Janas 阅读(227) 评论(0) 推荐(0)
CSS特效（8）——单行居中，多行居左，超过两行用省略号（绝对定位）
摘要：单行居中，多行居左，超过两行用省略号（绝对定位） 阅读全文
posted @ 2018-09-07 15:19 Janas 阅读(152) 评论(0) 推荐(0)
CSS特效（7）——单行居中，多行居左，超过两行用省略号
摘要：单行居中，多行居左，超过两行用省略号 阅读全文
posted @ 2018-09-07 15:18 Janas 阅读(277) 评论(0) 推荐(0)
CSS特效（6）——使用 mix-blend-mode 制作文字背景图
摘要：使用 mix blend mode 制作文字背景图 阅读全文
posted @ 2018-09-07 15:17 Janas 阅读(228) 评论(0) 推荐(0)
CSS特效（5）——使用 background-clip 制作文字背景图
摘要：使用 background clip 制作文字背景图 阅读全文
posted @ 2018-09-07 15:16 Janas 阅读(227) 评论(0) 推荐(0)
CSS特效（4）——使用 background-blend-mode 制作 hover 效果
摘要：使用 background blend mode 制作 hover 效果 阅读全文
posted @ 2018-09-07 15:15 Janas 阅读(190) 评论(0) 推荐(0)
CSS特效（3）——target伪类实现tab切换
摘要：target伪类实现tab切换 阅读全文
posted @ 2018-09-07 15:14 Janas 阅读(143) 评论(0) 推荐(0)
CSS特效（2）——input radio、label实现tab切换
摘要：input radio、label实现tab切换 阅读全文
posted @ 2018-09-07 15:13 Janas 阅读(441) 评论(0) 推荐(0)
CSS特效（1）——css伪类实现表单验证样式
摘要：css伪类实现表单验证样式 阅读全文
posted @ 2018-09-07 15:11 Janas 阅读(273) 评论(0) 推荐(0)
CSS常用技巧（3）——BFC
摘要：一、BFC的原理 1. 内部的box会在垂直方向，一个接一个的放置 2. 每个元素的margin box的左边，与包含块border box的左边相接触（对于从做往右的格式化，否则相反） 3. box垂直方向的距离由margin决定，属于同一个bfc的两个相邻box的margin会发生重叠（两个bf 阅读全文
posted @ 2018-09-06 19:45 Janas 阅读(132) 评论(0) 推荐(0)
CSS常用技巧（2）——文本类
摘要：一、超出区域文本以省略号显示 二、强制换行 三、文本缩进 四、文字描边 五、文字外发光 六、字体渐变： 七、表格td超出隐藏 设置table样式 八、通过``实现双虚线： 九、通过display:box ;line clamp实现多行溢出点点效果： 十、数字超宽换行 十一、CSS设置多张背景： 或者 阅读全文
posted @ 2018-09-06 19:43 Janas 阅读(182) 评论(0) 推荐(0)
CSS常用技巧（1）——布局类
摘要：一、背景图全屏 二、水平居中 1. margin 2. absolute+margin 3. absolute+translate 三、给高度自适应的div设置背景图 不给height，设置padding 四、利用视口单位做自适应： 五、响应式网格布局 在容器上设置： 六、利用text align: 阅读全文
posted @ 2018-09-06 16:30 Janas 阅读(142) 评论(0) 推荐(0)