前端开发

全局属性hidden

2019-04-1952次阅读html5
hidden属性是HTML5中的新属性。hidden属性规定对元素进行隐藏,隐藏的元素不会被显示,包括例如屏幕阅读器。但藏元素及其后代的元素仍处于活动状态,这意味着script脚本元素仍然可以执行,form表单元素仍然可以提交。即元素和脚本可以引用隐藏在其他上下文中的元素。改变具有hidden属性的元素的CSS的display属性将覆盖该行为。 例如元素被设置为display: flex将会导致元素显示出来,尽管设置了hidden属性。
前端开发

CSS3 滤镜(Filter)使用小结

2019-04-19100次阅读css3
CSS3滤镜(filter)与我们经常说的IE滤镜是两码事,IE滤镜是指老版本的(4.0 到9.0)Windows IE浏览器支持一种非标准的 "filter" ,目前已经被现代浏览器弃用。CSS3滤镜(filter)属性提供的图形特效,如灰度、透明度、模糊、阴影等。
前端开发

CSS中制作三角形

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

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

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

position:sticky粘性定位

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

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

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

了解Event Emitters事件发射器Typescript版

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

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

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

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

2019-04-1787次阅读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-17112次阅读css3
在Web制作中,有些时候需要实现一些倒影的效果,可以使用非标准属性-webkit-box-reflect实现。