爱吃面包的兰兰-CSDN博客

原创 Babel初体验

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

2017-09-19 20:14:47 446

原创 CSS3自定义滚动条样式

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

2017-08-18 20:07:27 316

原创 Web Animations API (JS动画利器)

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

2017-08-09 19:14:05 485

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

原文地址：→传送门写在前面在五月出捣腾了一把个人博客，但是刚开始只做了一些基础设置，套路也没摸清，基础安装篇请看hexo从零开始到搭建完整,里面讲到了基础工具的安装及blog项目的文件夹含义，以及RSS添加、域名的绑定等操作，后来想着加点功能，但是奈何我选的主题集成的东西比较少，需要一比一步自己添加，于是摸索了一番。。。现在真是发现了next主题的好处，不仅持续更新，而且作者已经在主题中集成了各种功

2017-08-01 20:44:49 3084

原创定时器（setTimeout）的秘密

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

2017-07-28 22:46:58 3458

原创拖放API中的drag和drop实战

原文地址：→传送门写在前面在HTML5之前，实现拖放功能需要借助mousedown/mousemove/mouseover/mouseout/mouseup等鼠标事件来完成，HTML5中拖放API的出现使很多事情变简单。下面是做笔记做笔记~注：未来得及做兼容，请在chrome中打开。源码地址栗子预览1栗子预览2栗子预览3拖放过程拖放：包括拖拽（drag）和释放（drop）拖放中涉及两个

2017-07-27 21:10:34 1359

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

原文地址：→传送门window相关宽高属性1. window.outerHeight (窗口的外层的高度) / window.outerWidth (窗口的外层的宽度)window.outerHeight获取整个浏览器窗口的高度（单位：像素），包括侧边栏（如果存在）、窗口镶边（window chrome）和窗口调正边框。包含调试窗及浏览器边框window.outerWidth表示整个浏览器窗口的

2017-07-27 21:09:21 391

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

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

2017-07-27 21:07:39 3221 1

原创原生JS实现省市区（县）三级联动选择

原文地址→看过来写在前面前段时间写一个关于天气的东西，里面的省市区（县）城市选择让我很头疼，在网上搜索出来大都是借助插件或者第三方库，感觉这样做代码会很重，所以索性就把几种城市选择的方式实现一遍，以备日后的不时之需。这三种方法都是针对pc端的，并且都是使用原生js实现的，连jq都没使用，于是代码有点繁琐额（尴尬）。。。。不过还是让我把原理讲完吧。源代码地址→传送门预览地址→传送门方法一：下拉选择框实

2017-06-09 20:57:38 8763

原创 select表单元素详解及下拉列表模拟实现

原文地址：→看过来写在前面select 是HTML表单元素中很常用的一个，其中很重要的几个属性常被忽略，但这几个属性却能帮助我们完成很多的功能，当然，select下拉列表默认样式很不友好，所以更多的时候可以自己模拟实现一个同样功能的下拉菜单。下文先介绍select标签的一些属性及使用，后面再模拟一个相同效果的下拉菜单。介绍之前先看下demo预览图：firefox下select的默认样式： chro

2017-06-08 23:21:20 1637

原创预览github项目的html文件新方法

原文地址：→看过来写在前面关于如何在线预览github中的html文件，其实这是一个很多人知道的东西，但是查资料的时候呢总是找不到正确的答案，并且一开始我也是踩了坑的。踩坑经历搜出来的结果大概就两种：第一种是在你打开的源码地址的url地址基础上加前缀http://htmlpreview.github.io/?或者http://htmlpreview.github.com/?(注：填这个还是会转到前

2017-05-19 14:35:28 529

原创 RegExp（正则表达式）常用知识点小结

原文地址：→看过来正则表达式用到的地方很多，但是每次很久不用就全忘光了，每次都要重新看一遍文档，为了节省时间，把它的一些基本要点画总结在一张图片中，这样方便以后查看。PS：细节的东西还是需要看详细点的文档。

2017-05-18 18:46:12 345

原创中文技术文档写作规范 - 改自阮一峰老师

以前从来去想一篇技术文章要怎么架构，总是随自己想到什么写什么，然后看到了阮一峰老师的总结，就把它改成了思维导图，以便记忆查询。原文地址：https://github.com/ruanyf/document-style-guide

2017-05-18 18:44:44 409

原创纯CSS3实现饼状loading效果

原文地址：http://visugar.com/2017/05/17/CSS3%E9%A5%BC%E7%8A%B6loading%E6%95%88%E6%9E%9C/写在前面（附录有源码及效果）之前碰到一个小练习，就是用纯CSS3来写饼状的loading效果，之前着实没有写过这玩意儿，小花完全没头绪，然后参考了张鑫旭老师的CSS3实现鸡蛋饼饼状图loading等待转转转，还有些别的东西，用一种看起来

2017-05-17 22:27:08 429

原创 hexo从零开始到搭建完整

前言其实平时自己写的文章并不多，偶尔看到一些东西会做点笔记，但是每次写的东西都会到处放，不好找，所以才想着自己搭建一个人博客网站，现在大家用hexo比较多，也比较方便，并且能使用的主题也很多，所以小花就用她啦~耍起来由于小花的电脑在搭建博客之前就有了各种环境，但是对于没有任何基础的人来讲，我觉得还是从源头开始讲会好一点，就像教别人做菜，总得把所有的用料及步骤说清楚对吧？（大佬们可以自动忽略啊啊啊啊~

2017-05-07 18:49:42 688

转载 Button 按钮的点击时候出现蓝色边框

css控制Button 按钮的点击时候出现蓝色边框 – 北漂小兄弟http://www.inbeijing.org/archives/1139Button 按钮的点击时候出现蓝色边框的问题添加css属性，这样在点击安按钮的时候就不会有蓝色边框了。button{outline:none;}谷歌浏览器中button按钮的边框如何去除

2017-04-13 16:36:37 7858

转载 JS判断字符串长度（英文占1个字符，中文汉字占2个字符）

转载来源：http://blog.csdn.net/testcs_dn/article/details/21412303#//计算字符串长度(英文占1个字符，中文汉字占2个字符)方法一：[javascript] view plain copyprint?String.prototype.gblen = function() {

2017-03-24 11:31:19 495

原创菜鸟张小花之多种布局实现

居中布局水平居中垂直居中两列自适应布局三列自适应布局

2017-03-02 22:30:35 335

原创使用cmd来开启一个服务器

第一步：安装node.js 第二步：打开cmd，输入node -v 确认是否安装成功第三步：输入命令：ndoe install http-server -g 第四步：进入到项目的文件夹路径下，再输入http-server

2016-12-21 17:09:49 3255

Visugar