飞鸟42 - 博客园

2012年8月19日

摘要：本来写这篇文章，我可以有很多废话，但是很多都过去了，言而总之下：我暂且给这个方法起个名字，叫做“为之法”，因为有了这篇文章，很多人的想法会豁然开朗，那样有了个名字交流传阅起来就方便多了。本方法依托于editplus的自动完成，相信有一部分人还是玩过这个编辑器的，也知道里面有个叫做自动完成的东西，也许还正在使用呢，但是也有不知道的，可大家都是知道代码片段的，这个东西很好，ctrl+c，ctrl+v就可以了，很方便。现在有了这个editplus的自动完成，那个 ctrl+c和ctrl+v应该是可以退休了。好了，我们先说下用editplus来编写html。大概在一年半前吧，突然在一个外国的网站上发阅读全文

posted @ 2012-08-19 23:41 飞鸟42 阅读(548) 评论(0) 推荐(0) 编辑

2012年8月18日

The Top 10 Javascript MVC Frameworks Reviewed

摘要： Over the last several months I have been in a constant search for the perfect javascript MVC framework. Driven by a dire need for the right level of abstraction and features, I have tried out - some more cursorily than others - every framework I could get my hands on. Here lies a brief synopsis of e 阅读全文

posted @ 2012-08-18 17:08 飞鸟42 阅读(255) 评论(0) 推荐(0) 编辑

2012年8月9日

@拔赤：前端开发十日谈

摘要：一直想写这篇“十日谈”，聊聊我对Web前端开发的体会，顺便解答下周围不少人的困惑和迷惘。我不打算聊太多技术，我想，通过技术的历练，得到的反思应当更重要。我一直认为自己是“初级”前端开发工程师，一方面我入道尚浅，只有短短几年，另一方面我自知对技术的钻研并不深入，可能是由于环境的原因，当然最重要的是，我幸运的参与到互联网崛起的浪潮之巅。时势造就了一批技能薄弱但备受追捧的“弄潮者”，这在很大程度上影响我们对“技术本质”的洞察力，多年来也一直未有成体系的“前端技术”布道佳作，以至于当下多数人对前端技术的了解，盖始于表述并不严谨的岗位招聘描述，而这正恰恰反映了Web前端开发对自身的模糊定位。对于很多阅读全文

posted @ 2012-08-09 22:46 飞鸟42 阅读(265) 评论(0) 推荐(2) 编辑

2012年8月1日

IE6 幽灵文本(最后一个字出现莫名重复)

摘要：问题重现条件：1、一个容器包含2两个具有“float”样式的子容器。2、第二个容器的宽度大于父容器的宽度，或者父容器宽度减去第二个容器宽度的值小于3（注意是小于3，当等于3时不会出现重复文字）。3、在第二个容器前存在注释4、多出文字个数与注释的条数有关多出文字个数=注释条数*2-1 当多出文字个数大于容器中的字数时，多出文字消失代码：<div style="width:400px;height:200px;"> <div style="float:left;background:red;"></div> <!-- 阅读全文

posted @ 2012-08-01 14:33 飞鸟42 阅读(373) 评论(0) 推荐(0) 编辑

2012年6月15日

Jquery瀑布流插件

摘要：现在图片网与商城流行一种叫“瀑布流”的布局，我们公司也不小心得了“流行性感冒”，要搞这个。于是我就写了一个，现在再用我的框架mass重写一下，发布出来，顺便宣传一下我的框架。瀑布流其实没什么东西，就是列布局与无限拖的结合。由于要支持IE6就没有CSS3，直接对列进行绝对定位。列就是一个DIV。然后就是列中每个板块的添加问题，我管它为砖头。每添加一块砖头前，比较一下哪列最短，就往哪里塞。最后就是无限拖，太easy了。加之，我的框架对样式，事件等设置非常简单，比jQuery更方便。下面就是源码，用到了并行加载技术，预设时加载了random,ready,css,event这几个模块，它们就会自行加载阅读全文

posted @ 2012-06-15 11:16 飞鸟42 阅读(1846) 评论(0) 推荐(0) 编辑

2012年5月21日

Web开发中需要了解的东西

摘要：在StackExchange上有人问了这样一个问题：What should every programmer know about web development?（关于Web开发，什么是所有程序员需要知道的？）里面给出的答案非常不错，所以，我翻译转载过来。顺便说一下，StackExchange真是非常好，大家可以对同一个答案做贡献和修订，看看这个问题的修订过程你就知道了——专业的问答网站应该怎么去做。这就是我在这篇文章中也说过真正的用户体验是什么样的。好了，下面是正文（我对原文做了一些批注，也许不对或有误导，请大家指正）下面的这些东西可能对于大多数人并不陌生，但是可能会有些东西你以前并没有看阅读全文

posted @ 2012-05-21 08:36 飞鸟42 阅读(230) 评论(0) 推荐(0) 编辑

2012年5月11日

网易邮箱前端Javascript编码规范：基础规范

摘要：在多年开发邮箱webmail过程中，网易邮箱前端团队积累了不少心得体会，我们开发了很多基础js库，实现了大量前端效果组件，开发了成熟的opoa框架以及api组件，在此向大家做一些分享。今天想先和大家聊聊javascript的编码规范。总所周知，javascript是一种语法极其灵活的语言。javascript在设计之初就只是用来为HTML添加动态效果的。由于他动态，弱类型等特性，以及不同浏览器的兼容性问题，造成了开发成本要比java等语言要高很多。正因为它太灵活，我们制定了适用于网易邮箱的javascript编码规范，尽可能多的降低由于语法灵活造成的问题。以下将具体介绍：1. 变量命名规范变量阅读全文

posted @ 2012-05-11 16:45 飞鸟42 阅读(274) 评论(0) 推荐(1) 编辑

2012年3月22日

CssGaga 快速上手指南

摘要： CssGaga是ytzong（涛哥）基于我们在朋友网日常的重构工作流程，为了提高工作效率而开发并不断完善起来的一个重构辅助工具。运行于Windows + .NET的环境，提供了重构相关的一系列解决方案。最近越来越多的朋友通过腾讯微博、QQ和Email咨询到有关CssGaga的问题，由于CssGaga本身也是在不断升级，以前的教程有些已经陈旧，为了帮助新接触到这个工具的同学，我这里再写一篇日志介绍一下CssGaga的基本使用。CssGaga功能特性合并import的CSS文件，开发阶段将CSS文件按模块拆分复用，发布上线后合并减少HTTP请求；优化、压缩CSS代码，减少带宽占用，加快下载速度；优阅读全文

posted @ 2012-03-22 14:35 飞鸟42 阅读(504) 评论(0) 推荐(0) 编辑

2012年3月21日

CSS3 icon font完全指南

摘要：大家都知道现在各个浏览器都支持CSS3的自定义字体(@font-face)，包括IE6都支持，只是各自对字体文件格式的支持不太一样。那么对于网站中用到的各种icon，我们就可以尝试使用font来实现，本文将详细讲解这种用法。为什么要将icon做成字体？在很多网站项目中，我们常常会用到各种透明小图标，然后网站要兼容各个浏览器，也可能会有多个尺寸，甚至还要考虑换肤等需求。那么我们就要将这些小图标输出为多种尺寸、颜色和文件格式，比如png8 alpha透明或者png8 index透明等。比如，twitter用到的各种小icon：这种情况下，使用字体来实现图标就有很多优势：字体文件小，一般20-50k 阅读全文

posted @ 2012-03-21 10:33 飞鸟42 阅读(281) 评论(0) 推荐(0) 编辑

2012年3月7日

创建符合web标准的javascript横向不间断滚动文字代码

摘要：由于ie8不支持html的<marquee>标签了，因此用js创建一个代替它的兼容方案成为必要。我在网络上搜索了许多方案，没有找到一种非常符合web标准的方案，于是自己写了一个，供大家参考。<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml&qu 阅读全文

posted @ 2012-03-07 16:50 飞鸟42 阅读(499) 评论(0) 推荐(0) 编辑

获取元素属性函数getStyle的优化

摘要：在javascript中“-”(中划线或连字符)代表的是减号，而在CSS中，许多样式属性都有这个符号，如padding-left、font-size等，所以在javascript中如果出现如下的代码就一个错误：1 elem.style.margin-left = '20px';正确的写法应该是：1 elem.style.marginLeft = '20px';这里需要把CSS的中划线去掉并把原来紧跟在中划线后的字母大写，俗称“驼峰式”写法，不管是使用javascript设置或是获取元素的CSS样式都应该是驼峰式的写法。但是不少对CSS熟悉而又对javascrip 阅读全文

posted @ 2012-03-07 16:19 飞鸟42 阅读(274) 评论(0) 推荐(0) 编辑

2012年2月28日

区分概念：clientWidth/clientHeight/offsetWidth/offsetHeight/scrollLeft/scrollTop/scrollHeight/scrollWidth

摘要： 1、 offsetWidth offsetHeight 元素在页面中可视部分的宽度和高度总计（margin除外）。若CSS中没有指定元素的高度和宽度(即自适应)，所有浏览器都会显示实际的值包括width + padding + border（注意：不包含margin;滚动条是包含在内容width里面的。）2、 scrollTop 和 scrollLeft scrollTop和scrollLeft属性给出元素已经滚动的距离（像素值）。当你设置这些属性的时候，页面滚动到新的坐标。3、clientWidth clientHeight(存在兼容问题) 元素的可视部分的宽度和高度。它们不把边框... 阅读全文

posted @ 2012-02-28 15:54 飞鸟42 阅读(422) 评论(0) 推荐(0) 编辑

2012年2月25日

外边距叠加collapsing-margin

摘要：恩，margin叠加一直是个问题，也是我们一直会遇到的问题，很久以前就想把这个知识点整理下，做一个详细的讲解和分析。前一段时间知乎上有人问了这个问题，刚好克军也做了个回答，但回答的不尽其然，并且我做了自己的分析。刚好今天写到自己的博客里，并做一个更详细的探讨。今天主要介绍的就是：到底神马是外边距叠加？神马情况下外边距会叠加？如何避免外边距叠加？外边距叠加的定义请先阅读w3c关于collapsing-margin的官方介绍：In CSS, the adjoining margins of two or more boxes (which might or might not be sibling 阅读全文

posted @ 2012-02-25 11:18 飞鸟42 阅读(292) 评论(0) 推荐(0) 编辑

2012年2月22日

Object instanceof Function 还是 Function instance of Object，是真是假，一一道来

摘要：如今的JavaScript再也不是以前被当做玩具的在网页上运行的花哨的脚本了。JavaScript已经逐渐标准化，作为一门真正的编程语言广泛地应用在Web开发上。因此，越来越多的人开始重新认识这门脚本语言，并在不断地探索关于JavaScript核心思想和实现原理，过程中遇到了一些非常混淆的问题。本文着重解释一个比较常见但是非常容易使开发人员或者是初学JavaScript的人非常混淆的问题，那就是两个核心构造函数Object 和Function，他们之间到底有什么关系？为何instanceof运算符的返回结果会让你感到混淆？本文将为你一一道来。不过在这之前，我们需要先了解一些JavaScr 阅读全文

posted @ 2012-02-22 14:31 飞鸟42 阅读(322) 评论(0) 推荐(0) 编辑

2011年12月31日

Guangchen Chen：前端工程师的职业发展路线在哪里？

摘要：前端工程师的职业发展路线在哪？我猜想国内很多前端工程师都想过这个问题吧。前端工程师往往属于产品研发团队，但却很容易被边缘化——后端工程师觉得自己才是主力，没有后端工程师产品就不存在了，但没有前端工程师产品还能有，只是界面非常糟糕而已。这时候前端工程师就开始感觉自己像是个外包似的，只是来帮别人完成一些任务而已，对产品没有归宿感。这时候前端工程师的职业发展路线在哪？成为一个更好的外包吗？要做关键任务我觉得，要别人重视你的工作，不仅仅是你做得好就行了，还要求你的工作对别人来说足够重要。这跟产品定位有关——例如说对搜索引擎来说，前端对产品的影响不会非常大，用户只要能搜索到自己想要的结果就行了。阅读全文

posted @ 2011-12-31 16:37 飞鸟42 阅读(335) 评论(0) 推荐(0) 编辑

2011年12月23日

28个你必须知道的HTML5的新特性，技巧以及技术

摘要：原文：http://net.tutsplus.com/tutorials/html-css-techniques/25-html5-features-tips-and-techniques-you-must-know/译文来自：http://adamlu.com/?p=584总结一下：1. 新的Doctype尽管使用<!DOCTYPE html>，即使浏览器不懂这句话也会按照标准模式去渲染2. Figure元素用<figure>和<figcaption>来语义化地表示带标题的图片<figure><img src="path/to/ 阅读全文

posted @ 2011-12-23 16:23 飞鸟42 阅读(230) 评论(0) 推荐(0) 编辑

2011年12月21日

Javascript的匿名函数

摘要：一、什么是匿名函数？在Javascript定义一个函数一般有如下三种方式：函数关键字(function)语句：function fnMethodName(x){alert(x);}函数字面量(Function Literals)：var fnMethodName = function(x){alert(x);}Function()构造函数：var fnMethodName = new Function('x','alert(x);')上面三种方法定义了同一个方法函数fnMethodName，第1种就是最常用的方法，后两种都是把一个函数复制给变量fnMethodN 阅读全文

posted @ 2011-12-21 16:23 飞鸟42 阅读(189) 评论(0) 推荐(0) 编辑

2011年12月6日

Block Formatting Contexts(块级格式化上下文)

摘要：前几天看到kejun‘s blog里面的一篇文章：“近期面试感受”，里面提到面试时的一道题的不同的解决方案，比较它们之间的优缺点，其中出现了一个概念：Block Formatting Contexts(块级格式化上下文)，而我一点印象都没有，所以就找了一些相关的文章学习一下，看到一篇很好的文章，所以就翻译出来和大家共享一下。原文是：Block Formatting Contexts一个块级格式化上下文是满足以下条件中至少一条的盒模型：float的值不为空overflow的值不为visibledisplay的值是table-cell、table-caption或者inline-block之一阅读全文

posted @ 2011-12-06 14:56 飞鸟42 阅读(513) 评论(0) 推荐(2) 编辑

2011年12月1日

教你快速屏蔽外链优酷视频的30秒广告

摘要：现在有很多的小企业网站视频都是先把视频传到优酷上，然后再通过优酷的分享链接链接到自己的网站上，本来这是个为公司节省开支的好办法，但最近优酷的视频播放前长达30秒的广告实在是让人无法忍受，于是屏蔽广告显得就很有必要了。其实方法很简单，很土鳖，但很实用，简单说就是把优酷的新款播放器替换成旧版的播放器，方法如下：首先，你获取到你要外链的视频的html代码，例如http://v.youku.com/v_show/id_XMzI2MDM4NzI4.html的视频html代码如下：<embed src="http://player.youku.com/player.php/sid/XMzI 阅读全文

posted @ 2011-12-01 11:12 飞鸟42 阅读(978) 评论(2) 推荐(0) 编辑

2011年11月25日

JavaScript中的与（AND）、非（OR）逻辑运算符到底是如何工作的

摘要：昨晚，我看了Douglas Crockford讲解的题为“JavaScript编程语言”的视频，并从中学到一些有关JavaScript中与（AND）、非（OR）逻辑运算符的有趣内容。我想，应该把它分享给大家。首先，先让我们一起看一下逻辑与（AND）运算符。1if(expr1 && expr2){//do something }按照我对此运算符（operator）的早期理解，如果操作数（operand）“expr1”和“expr2”同时为真时，那么上面的代码片段将会执行任何位于if语句块中的内容。这是绝对正确的，并且恰好也是如此工作。唯一的蹊跷是，究竟幕后实际发生了什么。根据Mo 阅读全文

posted @ 2011-11-25 09:14 飞鸟42 阅读(395) 评论(1) 推荐(1) 编辑