02 2017 档案
摘要：一. label标签 1. 概念： HTML <label>元素表示用户界面中项目的标题。它通常关联一个控件，或者是将控件放置在label元素内，或者是用作其属性。这样的控制称作label元素的labeled control 2. 用法： 用法1： <label>Click me <input ty
阅读全文
摘要：一. 单列布局 1. 水平居中 (1) 文本、图片等行内元素 1 2 3 4 5 <style> .parent { text-align: center; } </style> (2) 定宽块级元素 1 2 3 4 5 <style> .child { margin: 0 auto; } </st
阅读全文
摘要：金三银四搞事季，前端这个近年的热门领域，搞事气氛特别强烈，我朋友小伟最近就在疯狂面试，遇到了许多有趣的面试官，有趣的面试题，我来帮这个搞事 boy 转述一下。 “小伟，你说说这几行代码会输出什么？” 当面试官在 Sublime 打出这几行代码时，我竟有点蒙蔽。蛤？这不是最简单的一个循环吗？是不是有陷
阅读全文
摘要：金三银四搞事季，前端这个近年的热门领域，搞事气氛特别强烈，我朋友小伟最近就在疯狂面试，遇到了许多有趣的面试官，有趣的面试题，我来帮这个搞事 boy 转述一下。 “小伟，你说说这几行代码会输出什么？” 当面试官在 Sublime 打出这几行代码时，我竟有点蒙蔽。蛤？这不是最简单的一个循环吗？是不是有陷
阅读全文
摘要：动态加载/删除css文件以及图片预加载 动态加载/删除css文件以及图片预加载 功能模块页面 最近，工作中遇到了一个比较奇葩的需求：要在一个页面（PC端）增加一个功能模块，但是这个页面在不久之后要重构，为了新增加的模块可以继续复用，必须做到这个模块的样式对页面其他模块不能造成影响，旧版页面使用boo
阅读全文
摘要：李小龙说过:"天下武功,无坚不摧,唯快不破".(真的说过吗?)我想说的是:"世间网站,完美体验,唯快不破".(这个我承认我说过.) 俗话说,时间就是生命,时间就是金钱,时间就是一切,人人都不想把时间白白浪费,一个网站,最重要的就是体验,而网站好不好最直观的感受就是这个网站打开速度快不快,卡不卡. 当
阅读全文
摘要：在平时工作中用到伪类选择器的时候一个冒号和两个冒号貌似都是可以的，所以两者到底有什么区别呢，我们先来看下W3C关于CSS3选择器的规范中有一段描述： A pseudo-element is made of two colons (::) followed by the name of the pse
阅读全文
摘要：需求：需要实现纵向列表左边的一条时间轴，时间轴中间除穿插具体的时间节点外不可间断，单击右边信息盒子里的图标，向下弹出子盒子并撑开列表，时间轴相应的延长。再单击图标，子盒子隐藏，时间轴收缩。看图来直观的了解一下这个需求，为便于观察，使用了醒目的红色线段和紫色边框如图a、图b所示： 图a 初始状态下的时
阅读全文
摘要：目前做代码压缩合并的工具有很多，诸如gulp，webpack，grunt等等，可以说这些项目构建工具的功能非常之强大：图片压缩、图片转base64、css和js的压缩以及合并，文件的md5重命名 ……。本人之前也是在项目中没具体使用过，闲来无事，查查资料，自己写了一个用gulp工具的小demo，有很
阅读全文
摘要：ECMAScript 6已经逐渐普及，经过二十多年的改进，很多功能也有了更成熟的语句，比如 for 循环 这篇博客将介绍一下从最初的 for 循环，到 ES6 的 for-of 等四种遍历方法 先定义一个数组： const myArray = [1, 5, 9]; myArray.name = 'w
阅读全文
摘要：前言 众所周知，css是静态语言，虽功能强大，但用起来还是略微不爽，于是便有了动态样式语言，sass和less。动态样式语言的精髓就在于其有了变量，其中的诸多功能都是建立在变量之上的。因此，彻底弄懂sass和less中变量的异同之处，是学好它们的关键！本文由浅至深，逐步展开介绍，并从大家所熟知的JS
阅读全文
摘要：上一篇 文章 了解了Vue.js的生命周期。这篇分析Observe Data过程，了解Vue.js的双向数据绑定实现原理。 一、实现双向绑定的做法 前端MVVM最令人激动的就是双向绑定机制了，实现双向数据绑定的做法大致有如下三种： 1.发布者-订阅者模式（backbone.js） 思路：使用自定义的
阅读全文
摘要：JavaScript提供定时执行代码的功能，叫做定时器（timer），主要由setTimeout()和setInterval()这两个函数来完成。它们向任务队列添加定时任务。初始接触它的人都觉得好简单，实时上真的如此么？这里记载下，一路对其使用姿势变迁的历程。 你所不知道的setTimeout 1,
阅读全文
摘要：我们在实际生活中总会遇到这样的事情，我们一旦登录（首次输入用户名和密码）某个网站之后，当我们再次访问的时候（只要不关闭浏览器），无需再次登录。而当我们在这个网站浏览一段时间后，它会产生我们浏览的记录，而且有的网站还提供购物车的功能。这些简单实用的功能就是通过Cookie与Session实现的，接下来
阅读全文
摘要：最近在做移动端项目时，需要实现一个列表页面的每一项item向左滑动时出现相应的删除按钮，本来想着直接使用zepto的touch.js插件，因为之前实现相同的功能时用过这个插件，当时还挺好用的，直接使用它的swipeLeft和swipeRight方法即可，可是今天又开始做这个功能时，却发现这两个方法在
阅读全文
摘要：我们经常会遇到一些场景，需要你向别人展示一些操作或是效果——例如告诉别人某某软件的配置步骤啊、刚设计出来网站的动画效果怎么样啊、某某电影里面的一个镜头多么经典啊、打得大快人心的NBA绝杀瞬间是怎么回事啊，等等.... 这些场合，如果单纯截成图片有时难以说清楚，但录成视频又不方便在社交软件上传播，这时
阅读全文
摘要：vue,vuex,vue-router放在一起能做什么？不用webpack之类的打包工具使用他们是否可行？各位道友在初学vue时是否有这样的困惑。因为现代构建前端项目的一般模式是： 安装webapck，某种是glup,grunt，或者是fis等构建工具 然后安装一个包管理器，npm，bower，或者
阅读全文
摘要：阅读目录 IMG元素你需要知道的两点知识 实践 兼容性 阅读目录 IMG元素你需要知道的两点知识 实践 兼容性 本片文章翻译自 Styling Broken Images 翻译过程中可能会在原意不变的基础上有些细微改动，望读者见谅 加载失败的图片是比较丑陋的，比如 但是我们可以让结果变得更美好。通过
阅读全文
摘要：今天心情烦躁，搭建个论坛各种失败，Laravel、React也学不进去，于是就复习复习学过的。记录一下很少用的东西。 代码摘抄于W3C菜鸟教程HTML5手册 语义元素 语义元素
阅读全文
摘要：上次想照着moe.hao123.com自己写一个看看，折腾了一下午这个问题，结果刚写到logo就放弃了，原因就是这个，这次又画一下午去弄清楚这个。大多数网站的Logo，图标和名称是在一起的。 显示效果 b67b4b4e94_999x231.png b67b4b4e94_999x231.png img
阅读全文
摘要：跟我一起学 React 😄，只为了缓解大家学习React的痛苦。 懂得也不多，所以有神马我理解错误的地方，请指正。 React 各大BAT都在用的框架，学到就是赚到。 这是我的 Learn 笔记，同样也是一份简明教程。 列一下资料：React英文版指南 # 先来准备一个基本页面 已经替换为国内的
阅读全文
摘要：移动端实现下拉刷新 第一部分：四个touch事件 1.touchstart：只要将手指放在了屏幕上（而不管是几只）,都会触发touchstart事件。 2.touchmove: 当我们用手指在屏幕上滑动时，这个事件会被连续触发。 如果我们不希望页面随之滑动，我们可以使用event的preventDe
阅读全文
摘要：引言 在很早以前，开源软件的开发并不受待见，甚至受到排挤，普遍认为软件是商业性质的产物，开源没有任何利益，也没有一个很好的平台去分享自己的技术成果。如今，观念发生了转变，认为开源更易于发现问题，解决问题，促进技术交流，技术升级，技术创新，并且能推动公司业务的发展。随着大型同性交友平台Github的诞
阅读全文
摘要：JavaScript有五种基本数据类型(Undefined, null, Boolean, String, Number),还有一种复杂的数据类型，就是对象。 Undefined 其实是已声明但没有赋值的变量的输出结果，null其实就是一个不存在的对象的结果 对于简单的数据类型它们值在占据了内存中固
阅读全文
摘要：完整目录： 基本概念 物理像素 设备独立像素 CSS 像素 PPI的概念 DPR的概念 缩放的概念 viewPort 的概念 viewport 渲染流程 Meta 标签说明 移动端布局实践 混合方式 REM 方式 响应式 JS自动换算 缩放方式 CSS3 缩放 viewport 缩放 相关补充 为什
阅读全文
摘要：在JavaScript编程中我们用的很多的一个场景就是写模块。可以看成一个简单的封装或者是一个类库的开始，有哪些形式呢，先来一个简单的模块。 简单模块 用IIFE创建一个闭包，隔离作用域，避免变量相互干扰。得到foo对象可以直接用了。这种适合小的模块，比如在ag中的写Service。 (functi
阅读全文
摘要：Vuex 强调使用单一状态树，即在一个项目里只有一个 store，这个 store 集中管理了项目中所有的数据以及对数据的操作行为。但是这样带来的问题是 store 可能会非常臃肿庞大不易维护，所以就需要对状态树进行模块化的拆分。 首先贴出一个逻辑比较复杂的H5项目：DEMO & 源码 该项目主要包
阅读全文
摘要：情人节到了，给大家来一朵高端的玫瑰花。 在网上看到的一个canvas实现的玫瑰花，效果很好，但是代码被压缩过，也没有注释，看的云里雾里的。 今天我教大脚用CSS来实现一朵玫瑰花。 先看效果 首先我们画出一个花瓣 1、画出一个长方形div，背景色设置成渐变色。 2、给四个角使用圆角，底部50%，顶部3
阅读全文
摘要：在Mvc模式大行其道的今天，后端通过各种Mvc框架实现视图与数据模型的隔离，而前端这方面也发展迅速。vue实现了Dom与viewModel双向绑定，使其视图的更新影响模型，模型的更新影响视图，你会不会觉得这就是Mvc库呢，实则不然，因为他还差一个重要的C(也就是控制器)。以下是鄙人对Mvc的个人理解
阅读全文
摘要：console.log允许你通过css来格式化输出，格式如下： console.log(‘%c字符串[%c字符串]’, 样式1, [样式2]) 其中”%c”为模板字符串 例子: 1 console.log('%cerrow','color:#fff;background:red') 输出结果： 改变
阅读全文
摘要：步骤1： 从Windows，Mac或Linux计算机远程调试Android设备上的实时内容。本教程将教您如何： 设置您的Android设备进行远程调试，并从开发机器中发现它。从您的开发机器检查和调试Android设备上的实时内容。将来自Android设备的内容屏幕截图到开发机器上的DevTools实
阅读全文
摘要：目录 作用域 全局作用域和局部作用域 块作用域与函数作用域 作用域中的声明提前 作用域链 函数声明与赋值 声明式函数、赋值式函数与匿名函数 代码块 自执行函数 闭包 作用域（scope） 全局作用域和局部作用域 通常来讲这块是全局变量与局部变量的区分。 参考引文：JavaScript 开发进阶：理解
阅读全文
摘要：http://www.cnblogs.com/ufex/p/6382982.html 每个浏览器都有自己的特点，比如今天要做的colorpicker就是，一千个浏览器，一千个哈姆雷特，一千个colorpicker。今天canvas系列就用canvas做一个colorpicker。 *********
阅读全文
摘要：http://www.cnblogs.com/jingh/p/6381079.html 开题：得益于项目的上线，现在终于有时间来写一点点的东西，虽然很浅显，但是我感觉每经历一次项目，我就学到了很多的东西，现在接着上次的文字轮播将本次项目中学到的其他东西分享出来。 这次分享的是一个基于jquery/z
阅读全文
摘要：闲谈：今天打开园子发现园龄已经指向1年，才恍然发现时间的流逝永远是悄无声息的，离开学校那座象牙塔已经也有大半年的事件了，生活中不再充满了茫然只有忙碌。连续加班加点大半个月，做的活动项目终于算是告一段落了，而今天也将是考验其真正价值的时候，现在将这次开发中遇到的问题做一下总结。 项目背景： 这次的项目
阅读全文
摘要：用脚本进行DOM操作的代价是很昂贵的，它是富web应用中最常见的性能瓶颈。主要有以下三种问题： 访问和修改DOM元素 修改DOM元素的样式导致repaint和reflow 通过DOM事件处理与用户进行交互 浏览器中的DOM DOM是（Document Object Model）一个与语言无关的、用来
阅读全文
摘要：前言 使用vue已经有三、四个月了，但是只是学着使用了一些基本方法。因为现在的前端框架越来越多（Angular，React...），但是我相信万变不离其宗，很多用法框架之间还是想通的，所以借总结的vue的机会深入了解vue到每个细节，以后能更加熟练地使用vue，有机会也能在别的框架中体会相通的思想。
阅读全文
摘要：Posted on 2017-02-06 19:49 Mr豆花 阅读(27) 评论(0) 编辑 收藏 img的title和alt有什么区别title是global attributes之一，用于为元素提供附加的advisory information。通常当鼠标滑动到元素上的时候显示。alt是img
阅读全文
摘要：可以实现手势操作：拖动、缩放、旋转。封装好的脚本方法是这样的： html代码： js调用：
阅读全文
摘要：深入理解-事件委托 2016-11-20 15:02javascript、web开发综合、性能优化JS性能优化、事件冒泡、事件委托、事件委托优化、事件委托导致性能损失 65 views 深入理解-事件委托 2016-11-20 15:02javascript、web开发综合、性能优化JS性能优化、事
阅读全文
摘要：作者：林东洲 链接：https://zhuanlan.zhihu.com/p/25070186 来源：知乎 著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。 三栏布局，顾名思义就是两边固定，中间自适应。三栏布局在开发十分常见，那么什么是三栏布局？比如我打开某东的首页： 映入眼帘的就是一个常见的三栏布局：即左边商品导航和右边导航固定宽度，中间的主要内容随浏览器宽度自适应。 ...
阅读全文
