前端开发

CSS中制作三角形

2019-04-1834次阅读css
在CSS中制作三角形是非常常见的UI任务。通过使用border边框制作CSS三角形或者使用HTML实体制作CSS三角形都是可行的方案。
前端开发

锚点定位更平滑css实现scroll-behavior

2019-04-1835次阅读滚动
CSS属性scroll-behavior为一个滚动框指定滚动行为,其他任何的滚动,例如那些由于用户行为而产生的滚动,不受这个属性的影响。在html根元素中指定这个属性时,将适用于整个视窗口。在某个元素上指定这个属性时不会传播到视口之外。有的用户代理可能会忽略这个属性。
前端开发

tiny-emitter一个轻型的事件发射库

2019-04-1834次阅读事件发射器
tiny-emitter是一个轻型的是事件发射器工具库主要用来实现一个简易的基于监听发布者模式的事件派发和接收器。当然喽,你也可以自撸一个TypeScript版的事件发射器。
前端开发

position:sticky粘性定位

2019-04-1750次阅读css3
在浏览网站时,通常会看到HTML元素(如横幅和导航)滚动到一定位置时就固定在浏览器的顶部。之前我们一直采用JavaScript滚动事件来监听滚动到一定位置时给此元素添加position: fixed固定定位。你是知道的固定定位是脱离文档流的哟,因此事先在HTML结构上,不要忘了给这个元素添加一个父元素写上高度占位,不然滚动到一定位置时就会出现页面抖动。如果不写高度占位,你可以尝试CSS Scroll Snap实现滚动捕捉及填充滚动容器空白区域文案。
前端开发

CSS Scroll Snap实现滚动捕捉及填充滚动容器空白区域

2019-04-1738次阅读滚动
CSS Scroll Snap是一个引入滚动捕捉位置的CSS模块,用于强制滚动容器的滚动端口在滚动操作完成后可能结束的滚动位置。利用CSS Scroll Snap可以实现滚动捕捉及填充滚动容器空白区域
前端开发

了解Event Emitters事件发射器Typescript版

2019-04-1736次阅读事件发射器
事件发射器是一种模式,用于侦听命名事件,触发回调,然后使用值发出该事件。有时这被称为“发布/订阅”模型或监听器。它指的是同样的事情。
前端开发

JavaScript设计模式之发布订阅模式

2019-04-1734次阅读javascript
有人把观察者(Observer)模式等同于发布(Publish)/订阅(Subscribe)模式,也有人认为这两种模式还是存在差异,本质上的区别是调度的地方不同。
前端开发

CSS3伪类选择器之 :nth-child()

2019-04-1733次阅读css3
先了解一下选择器为CSS3结构类的有哪些::first-child、:last-child、:nth-child()、:nth-last-child()、:nth-of-type()、:nth-last-of-type()、:first-of-type、:last-of-type、:only-child、:only-of-type、:empty。
前端开发

非标准CSS3属性-webkit-box-reflect制作倒影

2019-04-1759次阅读css3
在Web制作中,有些时候需要实现一些倒影的效果,可以使用非标准属性-webkit-box-reflect实现。
前端开发

animate.css一个跨浏览器的CSS动画库

2019-04-1643次阅读css3
animate.css一个跨浏览器的CSS动画库。简单易用。虽然已Star,但每次使用使用时都要在stars里查找。。。