首页 > 前端 ( 第 2 页)

经过大半个月的努力,终于完成了这次博客改版!

秉着追求极简与追求极速的想法:),这次博客升级做了不小的改动,现在看起来比以前舒服多了,小伙伴们都评价我的首屏加载非常霸气哈哈哈~

 

先看看老版本

之前用的是云落的Git主题,这是一款比较大众化的WordPress主题,有着相当大的使用量,相信下面这张图片一定会很眼熟:

继续阅读→

阅读全文

一、是什么

页面可见性API(Page Visibility API)是一个为了让你知道页面当前是否对用户可见而推出的一个HTML5 API。

它由三个部分组成:

document.hidden属性:布尔值,当页面被隐藏时(切换标签或者最小化浏览器时),返回true

document.visibilityState属性:这是一个字符串指示页面的状态,它有四个值

· visible 页面在当前可视范围内

· hidden 页面在后台标签页或浏览器最小化

· prerender 页面在后台标签页或浏览器最小化,但是可以通过某些方式看到预览(例如window系统中把鼠标移到任务栏浏览器图标会浮出一个预览的小窗口)

· unloaded 页面尚未被加载

3· visibilitychange事件:当用户将页面从可见切换为不可见,或将不可见切换为可见时,触发该事件

根据上面三个部分,可以写出这么一个例子:

继续阅读→

阅读全文

以往只是用Chrome的控制台console.log()输出调试信息,最近看到一些有趣的控制台输出,又发现了几个hack技能。

一、输出彩色文本

一般console.log()输出的都是黑色的文本,但是Chrome提供了给输出文本自定义样式的功能,它的格式为:

console.log("%c需要输出的信息 ", "css 代码");

例如想要输出彩色文本可以在控制台输入下面代码后回车:

console.log('%c输出彩色文本', 'background-image:-webkit-gradient( linear, left top, right top, color-stop(0, #f22), color-stop(0.15, #f2f), color-stop(0.3, #22f), color-stop(0.45, #2ff), color-stop(0.6, #2f2),color-stop(0.75, #2f2), color-stop(0.9, #ff2), color-stop(1, #f22) );color:transparent;-webkit-background-clip: text;font-size:5em;');

效果如下图:

2016071713565738

继续阅读→

阅读全文

博客好久没更新了,期末考试折腾了一个月,暑假又玩了一星期,是时候回来写文章了嘿嘿。

现在记忆力已经不像儿时那样的强悍了,有些东西还是得老老实实记下来不断温习。

 

一、DOM Event 对象

HTML DOM 事件有多种类型,例如鼠标事件、键盘事件、UI事件、触摸事件等等,详见 MDN Event

每触发一个HTML DOM 事件时,都会产生一个event对象,这个对象记录了所触发事件的信息,例如事件发生的所在元素、事件的类型、事件的状态等等,本文所谈及的就是HTML DOM 的 Event 对象。

继续阅读→

阅读全文

前言

正则表达式( Regular Expressions)是用来匹配字符串中的字符组合的模式,通过这个模式我们可以进行字符串的搜索和替换等操作。ECMAScript通过RegExp类型来支持正则表达式,当然,String 对象中也有多个方法支持正则表达式操作。

继续阅读→

阅读全文