- 博客(33)
- 收藏
- 关注
RSS订阅转载 ios的300ms点击延时问题
一、什么是ios的300ms点击延时问题 ios的移动端页面对点击事件有300ms延时。二、为什么存在这个问题 这要追溯至 2007 年初。苹果公司在发布首款 iPhone 前夕，遇到一个问题 —— 当时的网站都是为大屏幕设备所设计的。于是苹果的工程师们做了一些约定，应对 iPhone 这种小屏幕浏览PC端站点的问题。这当中最出名的，当属双...
2017-03-03 16:08:00
325
转载 让文档中的代码更好看
本文要介绍一个插件——Prism，有了它，你的文档中的代码将更好看。 工作中，我们会需要写一些说明文档，类似bootstrap、vue等的官方文档一样，我们的文档也要不仅实用，还要好看，经过使用，觉得prism还不错。 使用也很简单，下载（可以定制需要的支持的语言）好之后，在页面中引入： 比如要在文档中实现这样的效果： 我们可以在h...
2016-12-08 20:48:00
342
转载 git分支提交管理
随着需求的增多，为了多人协作的顺利进行，需要进行分支开发，进而带来分支管理问题。今天主要讲一下如何管理分支及提交。 为了使git更好用，下面是我的git配置文件（放在C:\Users\Administrator目录下的.gitconfig文件）。[user] email = xxx name = xxx[gui] encoding = UT...
2016-12-08 17:44:00
178
转载 compass入门
本文将参考官方文档，结合最佳实践，让我们把compass用起来。 进入项目目录（有疑问回看上一篇sass+compass起步），在sass目录下新建_base.sacc文件，该文件的用处是初始化样式表，内容是全局变量和要用的框架，此外，还可以放一些自己写的mixins。 P.S.下划线_开头的sacc文件不会编译成css，要注意，在同一个目录不能同时存在带下划线和不带下划...
2016-08-20 19:10:00
153
转载 sass+compass起步
前言：Sass is an extension of CSS that adds power and elegance to the basic language. It allows you to usevariables,nested rules,mixins,inline imports, and more, all with a fully CSS-compatibl...
2016-08-18 23:40:00
87
转载 ES6初探——编译环境搭建
不好意思我又要来写操作文档了，看起来更像wiki的博客（如果你想深入学习，请阅读文末列的参考资料）。本文将示例如何把ES6编译成ES5。 首先，你要自行查阅什么是ES6，和ES5、javascript有什么关系，为什么要编译ES6。废话不多说，just test! 方法一： 第一步：项目目录下安装babel-cli和babel-preset-es2015。...
2016-05-29 15:35:00
92
转载 gulp插件之gulp-mock-server
本文讲gulp-mock-server的应用，用于虚拟一个服务器，模拟后台返回json数据给前端，这样可以一定程度上实现前后端分离，约定好接口之后，前后端即可同时开发，从而提高效率。 在gulpfile里新建任务：//mock servergulp.task('mock', function() { gulp.src('.') .pipe(g.moc...
2016-05-15 23:19:00
188
转载 微信开发——前期配置
本文讲前端如何独立的进行微信开发(没有搭建后台，如何通过config接口注入权限验证配置)。 1、申请微信公众号成功后，进入微信公众平台（https://mp.weixin.qq.com/），登录。 2、在开发者工具中选择公众平台测试账号，点击进入，微信扫码授权登录。 3、进入测试号页面，得到测试号信息： 4、完成JS-SDK使用权限签名算法。...
2016-05-14 16:18:00
114
转载 浅析cookie
基本概念：cookie是指web浏览器存储的少量数据，该数据会在每次请求一个相关的URL时自动传到服务器中。 以博客园为例，我们看看cookie有哪些属性： 1、Name:cookie的名称； 2、Value：cookie名称对应的值； 3、Domain:设置cookie作用域。默认是当前web服务器的主机名。设置该属性可使大型网站子域之间共享cook...
2016-04-17 15:57:00
99
转载 node入门（三）——gulp运用实例
在上一篇《node入门（二）——gulpfile.js初探》中，我们知道了（看懂入门二及其参考资料）怎么运用gulp来更高效的开发，现在来示范一下。 在package.json里面配置好devDependencies："devDependencies": { "browser-sync": "^2.10.1", "del": "^2.2.0", ...
2016-04-10 14:50:00
74
转载 node入门（二）——gulpfile.js初探
本文关于gulpfile.js怎么写，利于完成个性化需求。本文开发环境默认已安装node，详情参考《node入门（一）——安装》。 一、安装gulpnpm install -g gulp 二、进入项目根目录，创建package.json文件npm init 现在项目目录下新增了package.json文件，内容如下： 三、在pa...
2016-04-09 18:11:00
102
转载 移动web开发填坑（一）
上周开始接触移动web开发，默默的掉进了很多坑里面。本文主要总结本周遇到的坑以及如何填坑。 1、px与rem换算。 设计稿的宽度一般是640px，而iphone是320px，所以测量设计稿的结果首先要除2，这时的单位还是px，下一步要转换成rem，怎么转换呢？得看根节点怎么设置的。 首先，任意浏览器的默认字体高都是16px，所有未经调整的浏览器都符合: 1em...
2016-03-26 13:39:00
64
转载 node入门（一）——安装
node可以让我们用js写服务器。此外还可以用来前端自动化开发，它找到特定服务要使用的包，然后下载、安装、管理。 首先安装node，进入官网下载需要的node版本，然后一键式傻瓜安装。（我的环境是windows） 使用cmd或git bash来执行node命令。 装好node之后就可以在命令行工具中进入项目目录使用node了。 可以运行命令node -v ...
2016-03-24 07:41:00
81
转载 移动web开发基础（二）——viewport
本文主要研究为什么移动web开发需要设置viewport，且一般设置为<meta name="viewport" content="width=device-width, initial-scale=1.0,user-scalable=no">. 首先，需要明白viewport是什么东东。看下图： 对于viewport，直接翻译成中文就是视口、视见区、观察...
2016-03-19 18:17:00
93
转载 移动web开发基础（一）——像素
这篇文章要弄清楚2个问题：一、什么是逻辑像素和物理像素；二、这两者有什么关系。 对于问题一，先抛出两个概念。我们经常使用的px就是逻辑像素，是浏览器使用的抽象单位；物理像素又和dp/pt（设备无关像素）、dpr（设备像素缩放比）有关。对于问题二，逻辑像素和物理像素可以通过下面的公式转换：1px=(dpr^2)dp. 那么现在问题来了，对于不同设备，dpr又是多少呢？ ...
2016-03-19 15:39:00
74
转载 关于min-height:100%的解决办法
前几天碰到一个问题，在用bs和jq2.2.0开发时，min-height设为100%在firefox和ie下没有起作用，先用css改了一下，但是min-height虽然是奏效了，但同时出现了其他css问题，千丝万缕，随后万能的js完美解决问题，简单粗暴。 首先说一下问题产生的原因：jq2+获取heigh没有兼容Ie，故height()不行。 查阅资料知：窗口的高度 ...
2016-02-20 15:14:00
509
转载 用类与原型写一个组件（三）——学习笔记
上一篇中，我们为组件添加了“删除一条item”的功能，现在，再增加一个“增加一条item”的功能。 首先，在页面中增加一个按钮，用来触发添加功能（红框中的内容是对比上一篇新加的代码）。 在main.js中绑定按钮的单击事件，触发add函数。 再在smartList.js里写add函数。 1 // 增加一条数据 2 SmartList.pr...
2016-01-05 12:07:00
67
转载 用类与原型写一个组件（二）——学习笔记
上一篇里，我们为smartList组件写了一个简单的setData方法，运用此原型方法创建了member list和group list两个列表，今天我们继续完善插件功能。 上一篇里，最终效果是这样： 生成了2个一模一样的列表，都有编辑和删除的功能。所以现在我们要改进一下插件，使用户可以定制出不一样的列表（选择性的拥有编辑和删除功能）。 我们想在创建对象的时候就...
2015-12-31 14:36:00
107
转载 用类与原型写一个组件（一）——学习笔记
前两篇博文里学习了类与原型的相关知识，现在就理论结合实际，看看如何用类和原型来写一个插件。 首先写好html页面如下，主要是引入jquery和bs，页面中放了一个id为memberList的div，用来放我们待会使用类和原型生成的item。 1 <html> 2 <head> 3 <meta charset="UTF-8">...
2015-12-30 15:26:00
106
转载 js类、原型——学习笔记
js 内置有很多类，我们用的，都是从这些类实例化出来的。1 function Object () {}2 function Array () {}3 function String () {}4 function Boolean () {}5 function Function () {} 比如,var a = {};等同于var a = new O...
2015-12-29 12:12:00
77
转载 创建组件核心文件——学习笔记
一般方法：1 //作为核心文件，先来一个闭包，禁止污染全局空间。2 (function(){3 'use strict';//该作用域内的代码使用js的严格模式4 5 })();高big方法：1 +function(){2 'use strict';3 4 }(); 其实是将一个空与funct...
2015-12-29 10:25:00
64
转载 git 使用（二）
之前写过一篇git使用（一）,那是入门篇，现在的（二）可以说是进阶篇吧，主要讲一些使用过程的注意事件及相关问题的解决办法。 一、push和fetch还需要输入用户名和密码？ 解决办法：看看公玥是否添加成功，输入ssh -T git@git.oschina.net，若返回Welcome to Git@OSC, yourname! 则添加成功。如果成功，则进入.git/目录改...
2015-12-27 13:17:00
80
转载 js作用域、异步——学习笔记
所有的 for if switch while do 等等，都属于块级作用域，里面声明的对象，外面也能访问。但function 函数里的作用域，在函数外是访问不到的。 但函数作用域里面可以访问外面。 内层永远可以访问外层的。 这就叫闭包，同时是一个立刻执行的匿名函数。 你给他加个名字也可以，不过这里可以省略名字，闭包中的函数可以匿名。 ...
2015-12-27 12:27:00
87
转载 js执行顺序——学习笔记
我们知道有个全局的window对象，js的一切皆window上的属性和方法。window上有个window.document属性，记录了整个html的dom树，document是顶层。 body 和 head 都是 doc上的一个属性。 上图中，head里面的打印结果是null，因为document是按照和我们阅读文字一样的方式按顺序加载的，并且，当加载到一...
2015-12-27 11:49:00
73
转载 sublime text 3 使用技巧
一、下载官网下载合适的版本（http://www.sublimetext.com/3）二、破解执行 Help->Enter license 粘贴你的License代码----- BEGIN LICENSE -----Andrew WeberSingle User LicenseEA7E-855605813A03DD 5E4AD9E6 6C0EEB...
2015-12-11 10:51:00
109
转载 git使用（一）
github因为众所周知的一些问题，不方便选为远程仓库，在此，我们选用oschina的远程仓库，首先去http://git.oschina.net/申请一个账号。 第一步，安装git(下载电脑系统对应的版本)。下载好之后双击安装，安装完成后，在开始菜单里找到“Git”->“Git Bash”，蹦出一个类似命令行窗口的东西，就说明Git安装成功！如下图所示： 然后...
2015-12-09 08:43:00
77
转载 几个不同的tab切换示例
上一篇《论tab切换的几种实现方法》中讲了tab切换的4种不同实现原理，那么，现在到理论联系实际的时候了，下面就写几个实例。一、仿”中国人民大学“官网的tab切换，背景是图片，效果图如下：鼠标移到新闻时的效果鼠标移到公告时的效果鼠标移到交流时的效果学术、交流和文体的内容为空，我没有写。完整代码如下： 1 <!DOCTYPE html>...
2015-10-27 17:38:00
191
转载 论tab切换的几种实现方法
tab切换在网页中很常见，故最近总结了4种实现方法。 首先，写出tab的框架，加上最简单的样式，代码如下： 1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8...
2015-10-16 15:41:00
232
转载 javascript学习之Date对象
前几天学习了一下date对象，于是写了一个简单的时间显示放到博客页面里(位于右上角)，类似这样的效果，时：分：秒 xxxx年xx月xx日。 下面来说一下具体实现步骤。 首先，既然date是一个对象，那么，在使用之前就需要创建这个对象var myDate = new Date();由于函数较简单且这个对象用的比较多，我就把它放到全局变量里面了。接着就要用这个对象现实时分秒年...
2015-10-08 10:25:00
64
转载 解决img标签间距问题
关于img标签间距问题：多个img之间有间距，包含img标签的div之间有间距。代码如下： 1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>test</title&...
2015-09-29 18:17:00
918
转载 负边距在布局中的应用
根据前几天对css负边距的研究（《浅析css负边距》），在理解负边距的原理之后，可以用在以下情况当中。一、两列布局1、右侧定宽，左侧宽度自适应 思路：要实现效果，首先，左侧的宽度要能够自适应，那么宽度可选100%或auto，我们知道设置成100%会使左侧div的宽度为父元素的100%，设置成auto会根据左侧div的实际大小自适应宽度，那如果div里面有块级元素，右侧就会被...
2015-08-31 17:54:00
88
转载 博客园样式个性化
虽然博客园有主题可以选，但是，作为前端工作者，当然还是要个性化主题的啦，下面就讲一讲如何把博客园首页个性化。 具体步骤如下： 1、进入 【管理>设置】，禁用模板默认CSS； 2、打开firefox浏览器，利用firebug查看博客园首页的html结构； 3、根据html结构添加样式，直接把css样式写到“页面定制CSS代码”下面的文...
2015-08-29 22:20:00
203
转载 浅析CSS负边距
本文主要讨论两点，1、左右负边距对元素宽度的影响；2、负边距对浮动元素的影响。在讨论这两点前，首先要理解盒模型、文档流。 盒模型，见下图，简单明了。 文档流，将窗体自上而下分成一行行,并在每行中按从左至右的顺序排放元素,即为文档流。 有三种情况将使得元素脱离文档流而存在,分别是浮动，绝对定位，固定定位.。但是在IE中浮动元素也存在于文档...
2015-08-28 08:58:00
92
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人