这篇文章将会向大家简要的介绍JavaScript里关于数组的最重要的5个方法,这5个方法是每个想要高效的进行JavaScript编程的程序员必须知道的。
这一点,我昨天在查资料写这篇文章—最全面的元素水平垂直居中方法汇总的时候就发现有个大牛也理解错了—-CSS布局奇淫技巧之–各种居中里面的第八点。
这里报错的原因是 querySelectorAll 所需的执行上下文必需是 document,而我们赋值到 $ 调用后上下文变成了全局 window。明白了这个道理后,我们再花不到四分之一柱香的时间,就改写了之前的版本,释出了正确的版本,这个版本里面,我们用正确的姿势去 alias。
Flexbox布局模式给网页布局提供了极大的方便,它更grid布局一样都是新出现的新型布局模式,为了让web开发者更容易的理解这种布局,本页内容提供了一个学习实验flexbox布局的场所,让大家更快更容易的了解flexbox布局的语法、用法和使用场景
我发现一个有趣的事情,竟然能在浏览器console里显示SVG图片和SVG动画!我迫不及待的要把这写出来,我想知道是否还有其他人之前也发现了这个用法。同时也为这个功能感到兴奋。我是在经过一系列的错误debug、测试和研究中偶然发现了可以在console里显示SVG图片,不仅仅能显示,而能够运行SVG动画。下面是一个动画效果截图:
使用JavaScript和HTML5技术绘制具有动态效果(流水、下雨、飘雾、飞雪等),而且还要伴音,水声、雨声、风声,栩栩如生。
之所以将word-break、overflow-wrap(word-wrap)和white-space这三个属性放在一起比较,是因为它们都有一个共同的作用,就是控制文本的换行。因为有三个,所以就容易混淆。这个三个属性有时候选任何一个都能实现我们的目标,但有时候只有某个特定的属性能实现我们的要求,这也就是我们今天要比较它们的原因,有相同点,也有不同点。
CSS变量,很像任何其它一种编程语言里的变量,可以让我们对一个值进行反复的引用。始自2017年4月,所有的现代浏览器都支持了这个功能,使得我们能编写出更紧凑、更清晰的CSS样式。
所谓”粘性侧边栏(Sticky Sidebar)”,是指页面上侧边栏(Sidebar)的一种滚动方式,正常情况下,侧边栏是跟整个页面是一体的,当页面滚动时,侧边栏跟着一起滚动,而很多页面侧边栏内容的高度很短,很快侧边栏就会滚出浏览器可视窗口,于是,侧边栏的位置变成了空白。这个空白实际上是一种资源浪费,而”粘性侧边栏(Sticky Sidebar)”的特点是,侧边栏的位置不会形成空白,
will-change 属性这种现象跟元素层叠顺序(类似z-index)混乱有关,但是因为要使用 will-change 属性,就必须要接受这种混乱的现实。
我想,这些浏览器开发商和规范制定者会说:“你想要更好的性能。而这些是我全部能做的了。有些事情我们做不了,但你们知道怎么做。这些之外的事情我们会尽力做好,剩下的事情你们来告诉我如何能做的更好。”
如果你开发的页面非常复杂,那么,这个CSS的contain技术可以帮助你优化页面的性能。而对于第三方的小饰件,始终使用contain: strict;是很好的习惯,它可以保护你的页面不受它们的干扰而出现性能问题。
然而,千万不要过度使用will-change属性,否则,事与愿违,页面的执行效率会降低,推荐的做法是当一个元素或属性发生变化时打开will-change,变化完成之后关闭它。
在浏览器中也可以使用JavaScript modules(模块功能)了。目前支持这一特性的浏览器包括: Safari 10.1. 谷歌浏览器(Canary 60) Firefox 54 – Edge 15 –
今年三月,微软宣布 Edge 浏览器将支持 CSS 变量。这个重要的 CSS 新功能,所有主要浏览器已经都支持了。本文全面介绍如何使用它,你会发现原生 CSS 从此变得异常强大。
一个flex父容器元素能给它的子元素建立一种新型的flex内容布局。这种布局其实是和将元素设定为display:block是很相似的,只是在flex布局里block换成了flex。float属性不好影响flex布局,flex父容器的margin不会和其子元素的margin有重叠效果。Flex父容器元素所形成的block容器特性跟普通的block容器元素所表现的特征完全一样。
这是一个实验演示如何控制(伪造)用户的鼠标指针,达到鼠标指针不听用户使唤的效果
这篇文章里,我将介绍如何修改修改手机浏览器地址栏和手机系统状态栏的主题颜色,让它跟你的网站的颜色相匹配。
11种调用一个函数的方法
在这篇文章里,我们将讨论如何构造一个高性能的视差效果,当然同样重要的是还得跨浏览器。
之前的文章里我介绍了如何在安卓手机上安装Linux,下面我将介绍如何在这个安装了Linux的手机上安装Lighttpd + php + sqlite3组合。
在PHP里系统命令可以放在反单引号(`)里执行。如果你要是使用nodejs,你需要调用引用child_process模块:
除了vm和vh两种单位外,还有两种类似的单位:vmin——取vw和vh中较小的一个为基准,和vmax——取vw和vh中较大的一个为基准。它们同样是一个单位数值,跟px、em、%的用法类似。
今天在网上看到一有趣的开关按钮的制作,用到了SVG、css3和js,下面的演示中还引用了TweenMax.min.js,这是一个js动画工具库。
上面的这个加载中效果,以前是用gif动图实现的,但随着CSS的进步,CSS动画功能越来越强大,我们只用一小片段HTML和CSS就能实现,方便了很多,体积也减小了很多。