主页

三月结

写在前面三个月没更新了,实在是对不起小胖友们及自己内心的小九九啊。趁着这两天有空,赶紧写一波。 论这三个月我去干嘛了,说实话,是我躲起来了,躲在了一片懒惰的海洋里!本文主要是微微的理顺一下这三个月发生的事情。 国庆 先从国庆前夕开始说起,感觉那几天过得及其快,快到让我忘记了所有的发生的事情,似乎那段时间自己已经没有了情绪,只是在等待国庆的来临。 9月28日晚上,经历了两个小时的等待之后,一个人

假装四天三夜的旅行

写在前面在九月,来一场说走就走的旅行,怕是比较困难,毕竟国庆长假马上就要来了。不过期盼了一年的部门旅游,总归是要去的,才不至于浪费 。至于为什么“难忘”,接着看下文就好了。 期盼大概是在七月份,听说今年的部门旅游有三条线,一国外二国内,想想好激动,毕竟还没出过国丫,心里盘算着一定要去国外。我们都美美的以为有泰国柬埔寨台湾九寨沟西安张家界其中的三个,最后的最后,我还是选择了三年前曾去过的杭州。 启

Babel初体验

写在前面现在es6很流行,尽管各大浏览器都还不能支持它的新特性,但是小伙伴们还是很中意它呀,于是小小的学习的一下 Babel这里我们不介绍es6相关内容,只是说下入坑前奏,记录下如何使用babel来对es6进行转码~ 1.准备一个项目(文件夹) 进入到你的项目根目录下,使用下面命令初始化生成一个package.json文件1npm init 2.安装babel使用下面命令安装全局babel-cl

CSS3自定义滚动条样式

写在前面滚动条是个很常见的东东,不过某些浏览器自带的滚动条确实不太好看啊,下面可以作为学习,探讨下自定义滚动条的实现,这样你的滚动条就可以美美的啦。但是,也只能玩玩,因为只针对webkit内核的浏览器啊啊啊啊啊! overflow介绍定义:overflow 属性指定当它溢出其块级容器时,是否剪辑内容,渲染滚动条或显示内容。 属性值12345overflow:visible //默认值。内容

Web Animations API (JS动画利器)

写在前面之前学习了CSS animation/setTimeout/setInterval/requestAnimationFrame等,这些都可以用在某种场景下的小动画,也可以说是动效。CSS动画君居然强大,但是缺陷也很多啊,有的时候没法满足要求,定时器用在动画中就更不使用了,但是requestAnimationFrame也是个很强大的东西,具体详情移步到window.requestAnima

Hexo博客添加SEO-评论系统-阅读统计-站长统计

交流群有相关问题的可进群提问,Hexo交流群:111868326 (其他的前端问题也可以交流) 写在前面在五月出捣腾了一把个人博客,但是刚开始只做了一些基础设置,套路也没摸清,基础安装篇请看hexo从零开始到搭建完整,里面讲到了基础工具的安装及blog项目的文件夹含义,以及RSS添加、域名的绑定等操作,后来想着加点功能,但是奈何我选的主题集成的东西比较少,需要一步一步自己添加,于是摸索了一番。。

定时器(setTimeout)的秘密

写在前面setTimeout()是大家再熟悉不过的定时器,但平时对定时器的了解甚少,于是想看看setTimeout()的原理机制。 setTimeout()基础setTimeout()函数用来指定某个函数或某段代码,在多少毫秒之后执行。它返回一个整数,表示定时器的编号,以后可以用来取消这个定时器。1var timeer = setTimeout(function|code,delay); 注:其

拖放API中的drag和drop实战

写在前面在HTML5之前,实现拖放功能需要借助mousedown/mousemove/mouseover/mouseout/mouseup等鼠标事件来完成,HTML5中拖放API的出现使很多事情变简单。下面是做笔记做笔记~ 源码地址 栗子预览1 栗子预览2 栗子预览3 拖放过程拖放:包括拖拽(drag)和释放(drop) 拖放中涉及两个元素,分别是:源对象和目标对象,如下图源对象是被拖拽的元

JS中client/offset/scroll等的宽高解析

window相关宽高属性1. window.outerHeight (窗口的外层的高度) / window.outerWidth (窗口的外层的宽度) window.outerHeight获取整个浏览器窗口的高度(单位:像素),包括侧边栏(如果存在)、窗口镶边(window chrome)和窗口调正边框。包含调试窗及浏览器边框 window.outerWidth表示整个浏览器窗口的宽度,包括侧边

css实现鼠标悬浮字体流光背景模糊效果

写在前面有的时候感觉写点小玩意儿挺开心的,还能实践很多的小知识点,所以这次学着写了个有趣的鼠标悬浮模糊效果,只使用了css额。 效果图 源码地址→传送门 预览地址→传送门 小知识点filter: blur(npx); 这个过滤器用来将图片模糊,但是兼容性不太好,n代表模糊度,值越大越模糊。 background-clip: text; background-clip是用于背景图片的裁剪,决定背景