- 博客(40)
- 收藏
- 关注
RSS订阅天猫商城首页设计是一个失败的产品
2014年天猫有两次大规模的改版，如果说第一次的改版让人觉得独特而富有创意的话，那么第二次则可以说是花哨+无聊+华而不实+哗众取宠+吃力不讨好。 很遗憾的是第一次改版的首页我们再也看不到了，现在只能看到那个让人厌烦的首页。 很明显第二次在技术上的实现要比第一次困难很多，但并不代表效果比第一次好了很多，不知道天猫的那些开发人员实现这个新的首页时会不会边工作边骂着自己的sb领导。...
2014-10-20 15:27:31
149
Javascript模块化编程（三）：实战-require.js的用法
这个系列的第一部分和第二部分，介绍了Javascript模块原型和理论概念，今天介绍如何将它们用于实战。我采用的是一个非常流行的库require.js。 一、为什么要用require.js？最早的时候，所有Javascript代码都写在一个文件里面，只要加载这一个文件就够了。后来，代码越来越多，一个文件不够了，必须分成多个文件，依次加载。下面的网页代码，相信很多人都见过...
2014-10-16 15:36:41
89
Web设计的未来：响应式设计路在何方？
2014年，通过移动设备上网的人数将超过PC端。在未来，设计移动设备将成为Web开发人员的首要任务。响应式设计似乎被看做成未来的设计方向，但我不赞同。今天，我要解释为什么我认为响应式设计并不是Web设计的最佳解决方案。什么是响应式设计？维基百科对响应式设计是这么介绍的：响应式Web设计是网站制作使用的一个叠层样式表( CSS3media queries)，结合流体网格适应各种...
2014-10-16 13:54:39
125
当今Web设计中存在的5大争议 ，你怎么看？
在 Web 空前繁荣的今天，有关 Web 设计中的各种观点很多会成为话题，有的很快达成一致，有的则一直争议下去，本文讲述 Web 设计中的 5 大经典争议，这些争议从它们诞生的那天起，就被正反两方争得不亦乐乎。争议之一：链接是否应该在新窗口打开正方:外部链接应该始终从新窗口打开，当你浏览一个站点的时候，点击了一个链接，却被带到另外一个站点，你在这个站点的会话也因此丢失，这实在令人恼怒...
2014-10-15 15:15:13
119
用原生JS获取CLASS对象
听说是最常用。。。。我是看了dom编程艺术想到的。 可以500%提高开发效率的前端UI框架！<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns=...
2014-10-15 13:47:53
262
Javascript教程:querySelector()方法
module dom {[Supplemental, NoInterfaceObject]interface NodeSelector {Element querySelector(in DOMString selectors);NodeList querySelectorAll(in DOMString selectors);};Document implements NodeSelector...
2014-10-14 15:51:52
454
一个简单的响应式横向网格布局框架Responsive Grid System
网页设计中有一个怎么也绕不开的问题，那就是布局问题。一般来说，一个div可能会分割成很多部分，同样是横向分割成两部分，但是在不同的项目中，我们可能会用不同的css代码，网格系统其实就是为这一类似的问题提供一个统一的解决办法。网格布局有很多，但是有很多非常复杂，往往无法二次开发。Responsive Grid System是国外的一个网站，他们提供了一种非常简单的实现。其实每一个前端开发人员都...
2014-10-14 14:31:22
167
ExtJs4 笔记之 layout 布局
本篇讲解Ext另一个重要的概念：布局。一般的容器类控件都是通过配置项items添加子控件的，这些子控件相对于父控件怎么定位呢，这里就要用到布局。 某些容器类控件，它本身默认就集成了一种布局方式，例如比较典型的是：Ext.container.Viewport 布局控件，它其实就是一个border布局的容器，还有Ext.form.Panel、Ext.tab.Panel等。本节我们系统的分析各种布局方...
2014-10-13 14:04:02
69
JavaScript实现可变参数函数
使用javascript类库函数时，经常会遇到一个函数，可以使用不同个数的参数的情况比如：exp(var1) exp(var1, var2) 但是在实际编写javascript函数时，函数不能同名，所以不可能是不同参数个数分开写；参数个数必须符合函数的设置，所以函数声明里有的就必须有，不可能调用时写少几个；……这个问题是困扰了很久了，一直不知道为什么？！...
2014-10-10 15:32:02
338
JavaScript Source Map 详解
Source Map。它是一个独立的map文件，与源码在同一个目录下，你可以点击进去，看看它的样子。这是一个很有用的功能，本文将详细讲解这个功能。一、从源码转换讲起JavaScript脚本正变得越来越复杂。大部分源码（尤其是各种函数库和框架）都要经过转换，才能投入生产环境。可以500%提高开发效率的前端UI框架！常见的源码转换，主要是以下三种情况：（1）压缩，减小体积。比如j...
2014-10-09 13:26:45
96
_blank开新窗口不符合标准?
我们要在新窗口中打开链接通常的做法是在链接后面加target="_blank"，我们采用过渡型的DOCTYPE(xh tml1-transitional. dtd)时没有问题，但是当我们使用严格的DOCTYPE(xhtml1-strict.dtd)时，这个方法 将通不过W3C的校验，会出现如下错误提示："there is no attribute targetfor this element...
2014-10-08 13:50:07
93
10大你不该做自由网页设计师的理由
大家垂涎于成为自由网页设计师的理由有成千上万个，其中三大主要的即是经济自由，创作自由，以及你可以在任何你喜欢的地方工作。但是，我现在要告诉 你，为什么这是一个坏主意。你也许有成百上千的理由讨厌你目前的工作。也许，你偶尔打电话请病假，仅仅是想多多休息一天，而并不在乎这一天的工资。又或 许，你从两周前就一直推拖着朋友的邀请？小而简单的理由也会有重大的影响。我可以列举100个你为什么不该做自由网页...
2014-09-30 13:50:04
112
用html5构建兼容iE6的网页
HTML5中的新元素自从HTML4.01 1999年发布后，互联网经过了翻天覆地的变化。今天，很多的HTML4.01都不再使用，或者几乎不再使用，或者不在像原来设计的方式使用。针对这些问题，HTMl5中我们删除并且重新设计了很多元素。为了更好的帮助大家创建HTML文档，HTML5标准中包含了一些新的元素，能够更好的为开发人员设计文档结构，更好处理，绘画或者显示多媒体内容。精心开发5年...
2014-09-29 15:53:07
84
重内容，轻语言，优先的产品才是王道，HTML5不能代表一切
两月余前，关于FACEBOOK放弃HTML5而改用原生的事被炒的沸沸扬扬，一时间HTML5的处境下滑冰点，归其原因是“慢”。Webkit的解析过程先后需要经过解析、建立DOM树、获取对应资源、布局、建立渲染树、绘图到展示。这跟传统的商品流通路径非常相似：工厂、品牌公司、总代理、经销商、卖场、消费者。由于环节太多层层加价，产品到达消费者手里往往价格居高不下。而HTML5的代价同样是用户为使用产品而...
2014-09-26 14:17:29
68
html5 中的 article 和 section 元素
HTML5带出了一系列新元素，并且将在未来被广泛应用。然而，有一些元素在使用时易被混淆，包括以下两个新元素：<article>和<section>。最常被问起的问题是：在什么情况下我们应该使用这些元素？以及我们应该如何正确的使用这些元素？Article元素从名字上，它已经很好的诠释了自己，但是我们仍要看看官方文档上是如何描述它的：“在文档，页面，应用或是站...
2014-09-25 15:06:27
153
HTML5 placeholder实际应用经验分享及拓展
一、HTML5 placeholder介绍placeholder在英汉词典中解释成了“占位符”。我们不妨将placeholder来个临时拆分：place + hold + er.placeholder指的就是：“足以镇住这块区占据位置的字符。无论是传统软件或是web应用中，placeholder都是相当常见的。 如FireFox浏览器右上方的搜索占位符：在可输入控件中，“占位符”...
2014-09-24 16:10:21
190
未知高度多行文本垂直居中
近日，微博上有朋友比较纠结未知高度的文本垂直居中问题。这个和「未知高度图片垂直居中」有些类似，但是有一些细节需要注意。这里有之前写的一个未知宽高对话框的垂直居中（拖动改变大小看是不是依然居中？），只不过对话框是相对于 viewport（视口）居中的，这里的文字需要的是相对于容器垂直居中。拿到这样的需求时，先不要想着如何兼容 IE6/7。先想想文字垂直居中靠什么属性？vertical-al...
2014-09-22 14:52:56
98
现代浏览器中内置的可以等效替代jQuery的功能
jQuery的体积在不断的增大。新功能要不断增加，这是必然结果。虽然从版本1.8.3开始的瘦身效果明显，但不可否认的是，对于移动手机端的网 页开发，它仍然是不可接受的。当然，jQuery不是铁板一块，你可以对它进行定制，只打包进你想要的组件，但其中的一些用来兼容老式浏览器的代码你无法 去除。就我的个人习惯来说，不管开发什么项目，即使是一个很简单的demo，我做的第一件事就是引入jQuery...
2014-09-17 15:51:37
124
10个扁平风格的wordpress主题
现在扁平设计风格真的很流行，你看连 iOS 7 都扁平了。本文向你推荐 10 个设计非常漂亮的扁平风格的 WordPress 主题。请欣赏：Nemo metro wordpress themeNemo 是一个 Metro 风格的 WordPress 主题，可设置纯黑背景。可以500%提高开发效率的前端UI框架！Argo one page metro style wordpres...
2014-09-15 16:32:17
563
响应式网页设计入门
响应式网页设计（Responsive Web Design）这个概念在2000年的时候就有人提出来了，其实我更喜欢将其翻译为自适应网页设计，阮一峰关于Responsive Web Design的一篇文章就是翻译为自适应网页设计，但是国内都采用了响应式网页设计这一生硬的翻译（你能第一次看到响应式网页设计这种称呼而联想到他的具体含义吗？）。既然这种二流翻译已经是主流，我也采用响应式网页设计这一说法。...
2014-09-11 15:15:40
105
HTML5 canvas性能之画圈
主要讲了HTML5 canvas性能方面的尝试，场景是在canvas上面绘制圆圈。我一直在尝试使用HTML5 canvas在圣诞树图片上面绘制泡泡。由于不知道哪种绘制的方法最好，最终在Stack Overflow上找到了使用radial gradients（辐射渐变）绘制圆圈的答案。圆圈你可能已经知道，标准地画圆圈的方法是使用arc()：分享一个最好用的UI前端框架！...
2014-09-10 13:43:23
177
原创 jQuery on()方法绑定动态元素的点击事件
之前就一直受这个问题的困扰，在jQuery1.7版本之后添加了on方法，之前就了解过，其优越性高于live(),bind(),delegate()等方法，在此之前项目中想用这个来测试结果发现，居然动态生成的标签点击了没反应，而live方法却能够支持，于是乎到处查资料，问网友，结果找了好久在一篇文章中终于找到了答案。。。 jQuery 使用on绑定动态生成的元素时，不能直接用该对象...
2014-09-09 15:05:57
918
1
明确规范，轻量级标记语言 Markdown 欲标准化
近日，为了明确规范，避免兼容性差等问题，Markdown 希望制定一个明确的规范，使其标准化。Markdown 是由 John Gruber 于 2004 年开发一种轻量级标记语言，它允许人们 “使用易读易写的纯文本格式编写文档，然后转换成有效的 XHTML 文档”。分享一个最好用的UI前端框架！正是因为简单易用的特点，目前 Markdown 已经被广泛运用在各种网站上，现在像是世界...
2014-09-09 14:30:32
121
原创 缓存jQuery对象来提高性能
jQuery使元素的选择变得异常简单，这也是它快速流行起来的一大原因，如果你看刚刚开始使用jQuery朋友写的代码时，会发现很多数人写的代码都在滥用jQuery选择器。如果你发现同一元素被查找多次时，你就应该将该jQuery对象缓存起来，不然每次查找都要遍历整个文档。这个话题可能显得有点老生常谈，因为这几天写的东西都和调试jQuery代码有关系，所以将这个问题再次说明一下。关于在控制台中打印...
2014-09-04 16:41:23
68
关于CSS细节集合(三)
一、让层显示在flash之上解决办法：给FLASH设置透明<param name=”wmode” value=”transparent” />或者<param name=”wmode” value=”opaque” />二、使一个层垂直居中浏览器中解决办法：使用百分比绝对定位，与外补丁负值的方法。{position:absolute; t...
2014-09-01 16:56:26
45
关于CSS细节集合(二)
一、IE6及以下不识别a 标签外的:hover伪类，在火狐，IE7里能正确达到效果，解决办法：.代码 #show li.s1{ border:1px solid #ff9900; background:#454242;} #show li.s2{ border:1px solid #D9D8D8; background:#312E2E;} 二、为...
2014-09-01 16:50:24
54
关于CSS细节集合(一)
一、当文字与图片在一行，需要将文字与图片底对齐，需要这样写：1<li>记住密码<img src="" align="bottom" style="margin-bottom:-4px"/></li>二、当文字与图片在一行，需要将文字与图片居中对齐，需要这样写：1&
2014-09-01 16:21:35
65
HTML5将重塑Web世界？
HTML5将重塑Web世界？ 2010年上半年的一个焦点事件，引起了很多人的关注，其中有不少人因这一事件第一次了解到HTML5的存在。初次了解HTML5的人可能会非常惊讶，HTML5规范早在6年前就开始制定了，如今尽管HTML5规范草案已经非常好，但何时能真正成为标准却仍然不确定。 的确，HTML5规范制定委员会工作进展非常缓慢。因为关于如何改进浏览器和改进Web世界，不管是浏览器供...
2014-08-26 15:06:22
117
AngularJS 、Backbone.js 和 Ember.js 的比较
1 介绍我们准备在这篇文章中比较三款流行于Web的“模型-视图-*”框架：AngularJS、Backbone和Ember。为你的项目选择正确的框架能够对你及时交付项目的能力和在以后维护你自己代码的能力产生巨大影响。你也许想基于一款可靠的、稳定的和成熟的框架来构建项目，但又不想为此受到约束。Web发展迅速——新技术产生，旧的那套方法很快跟不上潮流。如此形势之下，我们准备仔细深入的比较这三个框...
2014-08-26 13:39:10
139
原创 IE10和HTML5 你该了解的那些
你一定听说过HTML5，因为大家都在谈论它；也一定听说过Internet Explorer 10 和 Windows 8，可能你已经体验过了，那么它究竟好在哪儿？究竟能带来什么？Internet Explorer 10 和Windows 8 是微软即将发布的全新操作系统和浏览器，其中加入了在WP8 上表现出色的Modern UI（也就是我们常说的 Metro 风格），并且之后即将发布的 WP8 系...
2014-08-25 16:12:29
67
原创 20步打造最安全的Nginx Web服务器
Nginx是一个轻量级的，高性能的Web服务器以及反向代理和邮箱(IMAP/POP3)代理服务器。它运行在UNIX,GNU /linux,BSD 各种版本，Mac OS X,Solaris和Windows。根据调查统计，6%的网站使用Nginx Web服务器。Nginx是少数能处理C10K问题的服务器之一。跟传统的服务器不同，Nginx不依赖线程来处理请求。相反，它使用了更多的可扩展的事 件驱动...
2014-08-25 16:04:38
107
20步打造最安全的Nginx Web服务器
Nginx是一个轻量级的，高性能的Web服务器以及反向代理和邮箱(IMAP/POP3)代理服务器。它运行在UNIX,GNU /linux,BSD 各种版本，Mac OS X,Solaris和Windows。根据调查统计，6%的网站使用Nginx Web服务器。Nginx是少数能处理C10K问题的服务器之一。跟传统的服务器不同，Nginx不依赖线程来处理请求。相反，它使用了更多的可扩展的事 件驱动...
2014-08-25 15:43:44
132
原创 为您的Web项目构建一个简单的JSON控制器
摘要：无论您的项目使用的是哪种数据库后端，JavaScript Object Notation (JSON) 控制器都能简化您的开发工作。本文将带领您建立一个能够增强您的下一个开发项目的非常基础的 JSON 控制器。 您的下一个 PHP/MySQL 项目可能与您最近完成的十几个项目类似：建立一个 MySQL 数据库，创建包含 HTML 的 PHP 视图，根据需要添加 Jav...
2014-08-25 13:27:28
134
原创 从事前端开发必须要了解的CSS原理
从事Web前端开发的人都与CSS打交道很多，有的人也许不知道CSS是怎么去工作的，写出来的CSS浏览器是怎么样去解析的呢？当这个成为我们提高CSS水平的一个瓶颈时，是否应该多了解一下呢？ 一、浏览器的发展与CSS 网页浏览器主要通过 HTTP 协议连接网页服务器而取得网页， HTTP 容许网页浏览器送交资料到网页服务器并且获取网页。目前最常用的 HTTP 是 HTTP/1.1，这个协...
2014-08-25 13:10:44
52
原创 自己写的jQuery 左右选择框，大家多多指教！
Ui框架分享<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <HTML> <HEAD> <TITLE> New Document </TITLE> <META NAME="Generator" CON
2014-08-19 16:29:21
73
原创 javascript中event对象详解
event代表事件的状态，例如触发event对象的元素、鼠标的位置及状态、按下的键等等。 event对象只在事件发生的过程中才有效。 event的某些属性只对特定的事件有意义。比如，fromElement 和 toElement 属性只对 onmouseover 和 onmouseout 事件有意义。 例子 下面的例子检查鼠标是否在链接上单击，并且，如果shift键被按下，就取消链接的跳转。 前端...
2014-08-19 16:11:09
70
原创 学习记录jQuery的animate函数
很久之前就对jQuery animate的实现非常感兴趣，不过前段时间很忙，直到前几天端午假期才有时间去研究。jQuery.animate的每种动画过渡效果都是通过easing函数实现的。jQuery1.4.2中就预置了两个这样的函数：easing: {linear: function( p, n, firstNum, diff ) {return firstNum + diff * p...
2014-08-19 14:38:48
61
原创 在Asp.net中为图像加入水印信息
using System.Drawing;using System.IO;using System.Drawing.Imaging; private void AddTextToImg(string fileName,string text) { if(!File.Exists(MapPath(fileName))...
2014-08-19 14:02:39
56
原创 自我jQuery学习精华总结
因为项目需要，同时也因为兴趣，在近一段时间研究和使用了jQuery，它真的是太强大了，代码非常的优雅和简洁，好后悔现在才开始了解它，虽然目前网络上关于jQuery的资料、学习心得，教程多得你看不完，但我还是想把自己的一点学习经验写下来，不管是提供给那些想学习jQuery的人，还是保留一份学习笔记，我觉得这都是很有必要的。 在说jQuery之前，不得不提下现在也非常流行的mootools框架...
2014-08-19 12:45:07
116
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人