摘要: 说到 shadow-dom 可能很多人会很陌生。但是其实我们肯定碰到过,本文主要想简单介绍下 shadow-dom。下面直接进入正文。 shadow-dom 是什么 顾名思义, shadow-dom,直译的话就是 影子dom ?我觉得可以理解为潜藏在黑暗中的 DOM 结构,也就是我们无法直接控制操纵 阅读全文
posted @ 2016-07-27 17:05 ChokCoco 阅读(33065) 评论(19) 推荐(42) 编辑
摘要: 最近无论是工作还是自我学习提升都很忙,面对长篇大论的博文总是心有余而力不足,但又不断的接触学习到零碎的但是很有意义的知识点,很想分享给大家,所以本篇可能会很短。 本篇接我另一篇讲述 CSS 伪元素的文章: 【CSS进阶】伪元素的妙用–单标签之美,看完本文觉得有意思的可以再去看看上一篇,分享了一些伪元 阅读全文
posted @ 2016-07-13 18:13 ChokCoco 阅读(8023) 评论(18) 推荐(34) 编辑
摘要: 说到 CSS 颜色,相比大家都不会陌生,本文是我个人对 CSS 颜色体系的一个系统总结与学习,分享给大家。 先用一张图直观的感受一下与 CSS 颜色相关大概覆盖了哪些内容。 接下来的行文内容大概会按照这个顺序进行,内容十分基础,可选择性跳到相应内容处阅读。 色彩关键字 嗯,色彩关键字很好理解。它表示 阅读全文
posted @ 2016-06-28 10:34 ChokCoco 阅读(19049) 评论(28) 推荐(71) 编辑
摘要: box-shadow 在前端的 CSS 编写工作想必十分常见。但是 box-shadow 除去它的常规用法,其实还存在许多不为人知的奇技淫巧。 喜欢 markdown 版本的可以戳这里 。 box-shadow 常规用法 说到 box-shadow ,首先想到的必然是它能够生成阴影,所以称之为 sh 阅读全文
posted @ 2016-06-16 21:00 ChokCoco 阅读(25043) 评论(30) 推荐(57) 编辑
摘要: 最近在研读 《CSS SECRET》(CSS揭秘)这本大作,对 CSS 有了更深层次的理解,折腾了下面这个项目: CSS3奇思妙想 -- Demo (请用 Chrome 浏览器打开,非常值得一看)。采用单标签完成各种图案,许多图案与本文有关。 也希望觉得不错的同学顺手在我的 Github 点个 st 阅读全文
posted @ 2016-05-25 20:48 ChokCoco 阅读(25107) 评论(56) 推荐(141) 编辑
摘要: 最近在研究页面渲染及web动画的性能问题,以及拜读《CSS SECRET》(CSS揭秘)这本大作。 本文主要想谈谈页面优化之滚动优化。 主要内容包括了为何需要优化滚动事件,滚动与页面渲染的关系,节流与防抖,pointer-events:none 优化滚动。因为本文涉及了很多很多基础,可以对照上面的知 阅读全文
posted @ 2016-05-17 20:50 ChokCoco 阅读(107565) 评论(51) 推荐(142) 编辑
摘要: 承接上一篇:【CSS3进阶】酷炫的3D旋转透视 。 最近入坑 Web 动画,所以把自己的学习过程记录一下分享给大家。 CSS3 3D 行星运转 demo 页面请戳:Demo。(建议使用Chrome打开) 本文完整的代码,以及更多的 CSS3 效果,在我 Github 上可以看到,也希望大家可以点个 阅读全文
posted @ 2016-04-28 13:21 ChokCoco 阅读(18878) 评论(38) 推荐(80) 编辑
摘要: 之前学习 react+webpack ,偶然路过 webpack 官网 ,看到顶部的 LOGO ,就很感兴趣。 最近觉得自己 CSS3 过于薄弱,想着深入学习一番,遂以这个 LOGO 为切入口,好好研究学习了一下相关的 CSS3 属性。webpack 的 LOGO 动画效果乍看不是很难,深入了解之后 阅读全文
posted @ 2016-04-21 18:31 ChokCoco 阅读(65501) 评论(30) 推荐(67) 编辑
摘要: 性能优化一直是前端工作中十分重要的一环,都说从 10 到 1 容易,从 1 到 0 很难。而随着前端技术的飞速发展,没有什么技术或者法则是金科玉律一成不变的。 很佩服那些勇于挑战权威,推陈出新的勇者,是他们让我们的技术不断的变革更加的卓越。好像扯远了,本文主要想谈谈两个名词,域名发散和域名收敛。 域 阅读全文
posted @ 2016-04-07 20:19 ChokCoco 阅读(8146) 评论(27) 推荐(43) 编辑
摘要: 实践出真知,有的时候看到一些有趣的现象就想着用自己所学的知识复现一下。 boomJS 缘起 前几天在 github 上看到同事的一个这样的小项目,在 IOS 上实现了这样一个小动画效果,看上去蛮炫的,效果图: 我就寻思着,在浏览器环境下,用 Javascript 怎么实现呢? 在浓烈的好奇心驱使下, 阅读全文
posted @ 2016-03-29 18:25 ChokCoco 阅读(19903) 评论(53) 推荐(129) 编辑