随笔分类 - web前端学习、研究、应用
XHTML、CSS、JS、UI、UE、SEO
摘要：“Hasor是一款开源的 Java 应用开发框架。它是围绕 Guice 为核心创建的一系列模块组合而成。使用Hasor 会加快软件软件开发效率并降低开发成本。目前 Hasor包含了 Hasor-Core、Hasor-Web 两个主要的软件包。Hasor 的本质与Struts,Hibernate等单层框架不同，它可以提供一个以统一、高效的、友好的方式构造整个应用程序。并且可以将这些单层框架建立起一 个连贯的体系，可以说Hasor是一个搭建开发环境的框架。”更新记录：Hasor-Core v0.0.4 * New: 01.Environment 接口新增 isDebug 方法，用于表示应用程...
阅读全文
摘要：如何仅使用JavaScript支持的正则语法，将 1234<p> <table> <p> <p> </table> <table> <p> <p> </table> <p> 中<table>...</table>之间的<p>都替换为<br/>? 思考 该问题的难点之一在于JavaScript支持的正则特性实在有限。楼主已经想到了非JavaScript的解法，如下： 12re=/(?<=<table.*?)(<p
阅读全文
摘要：当软件行业进入互联网时代，市场对软件产品和服务的交付提出了更高的要求：不仅要快速实现需求，而且要快速发布上线，并且必须保证业务可靠、高效运行。为了满足这些要求，IT组织需要强有力的流程、技术和人员作为保障。 ThoughtWorks很早就认识到发布与运营对于成功交付的重要性。我们的创始人Roy Singham在《走完业务软件的“最后一公里”》[1]一文中指出： 所谓[软件开发的]“最后一公里”，是指软件满足了功能需求之后，尚未投入实际运行并创造业务价值的阶段。软件开发者──尤其是面对交付压力的软件开发者──常常对“最后一公里”视而不见。但它确...
阅读全文
摘要：我们设定密码强度等级为10，制作一张图片表示每个等级状态，给密码框绑定keyup事件，通过keyup事件获取密码值，然后使用正则进行判断密码强度等级，然后变换相应的图片。 查看示例：DEMO 使用很简单。 view plaincopy to clipboardprint?$('#pass').passwordStrength(); XHTML view plaincopy to clipboardprint?<p><label>请输入密码：</label><inputtype="password"id="p
阅读全文
摘要：利用 HTML(5) + Javascript + CSS就能开发惊人的游戏。下面将要介绍JavaScript游戏引擎包括了：3D、动画、 Canvas、Math、颜色、声音、WebGL等方面。1. General JS Game Engine Akihabara Akihabara is a set of libraries, tools and presets to create pixelated indie-style 8/16-bit era games in Javascript that runs in your browser without any Flash plug...
阅读全文
摘要：在CSS中有一个Alpha滤镜，这个滤镜可以设置目标元素的透明度。还可以通过指定坐标，从而实现各种不通范围的透明度。具体语法如下： 引用内容： {filter： alpha(opacity=opacity,finishopacity=finishopacity,style=style,startx=startx,starty=starty,finishx=finishx,finishy=finishy)} 具体参数： opacity 透明度。默认的范围是从0 到 100，他们其实是百分比的形式。也就是说，0代表完全透明，100代表完全不透明。 finishopacity 是一个可选参数，如果.
阅读全文
摘要：IE6在背景图片缓存上有一个bug：它会每次都从服务器端读取背景图片。例如我们使用a:hover更换背景图片，在IE6下会出现每次鼠标滑过 则重新向服务器请求图片，如果服务器反应较慢，那么hover效果就会出现短暂的空白，令人极度不爽。虽然可以通过CSS sprites的方式解决问题的，但效果差强人意。 示例： a{ background:url(normal.gif); } a:hover { background:url(hover.gif); } 如果为超级链接定义上述的css样式以实现鼠标悬浮时的动态效果，在firefox下是没有什么问题的，第一次加载之后，浏览器都会从缓存读取...
阅读全文
摘要：英文原文：Fixed vs. Fluid vs. Elastic Layout: What’s The Right One For You?译文原文：固定 vs. 流动 vs. 弹性：哪种布局更适合你？©请尊重作者和译者 若需转载 请依原样保留本声明另有一篇《自适应CSS布局——流动布局新时代》，在我草稿箱里放了快一个月了，一直没翻译完。但另有高手已经完成，请看：http://www.denisdeng.com/?p=324有一个问题已经困扰网页设计师们很久了：该使用固定、流动、弹性，还是混合布局呢？它们各有优缺点。最终的决定取决于网站的可用性，单用某一种布局就想达到目的，可能没那么
阅读全文
摘要：CSS标准化了的表格原文链接：A CSS styled table version 2本文介绍如何正确使用xHTML语言里的table标签——他应该只为展示数据所用。本文将帮助你赋予您的表格可达性，并教会你如何用CSS来定义你的表格以获得需要的视觉效果。XHTML部分如果你读过我关于表格问题的 第一篇文章，你可能还记得我建议你读一读Roger的 ‘Bring on the tables’ [表格全接触]。在这个问题上他的讨论的深度已达极致。不过，我还是想提醒您一些事情，在你想编写出拥有良好可达性的表格代码时请务必牢记这些原则：确保为表头[即某列或某行表格元素的标题，数据域标题。]使用 th元素
阅读全文
摘要：问题描述大家都知道, MySQL 中按某字段升序排列的 SQL 为 (以 id 为例, 下同):SELECT * FROM `MyTable` WHERE `id` IN (1, 7, 3, 5) ORDER BY `id` ASC降序排列的 SQL 为:SELECT * FROM `MyTable` WHERE `id` IN (1, 7, 3, 5) ORDER BY `id` DESC有时以上排序并不能满足我们的需求. 例如, 我们想要按 id 以 5, 3, 7, 1 的顺序排列, 该如何实现. 这也是很多国内外同行经常遇到的问题之一.下面我们给出按表中某字段, 以我们想要的列表方式排
阅读全文
摘要：1.1 等待的真相 整个过程听起来好像并不复杂,也许你从来都没有考虑过在这段等待的时间里世界都发生了什么变化,也许你早已习惯了利用这段时间东张西望或者品尝零食,或者你根本没有来得及意识到这点,新的网页就已经闪亮登场,恭喜你,你很幸运!但是在这个世界上,幸运儿永远只占少数,大多数人的大脑处理速度已经让他们明显感觉到这段等待时间漫长无比,久经考验的他们可以随时身手敏捷地打开多个浏览器窗口与时间赛跑,并为此筋疲力尽。 另一方面,对于站点经营者来说,让用户等待的时间过长,也许会造成毁灭性的后果。我见过很多人为了享用某家特色小吃而在餐馆门口乐此不疲地排着长队,但没有听说有多少用户执着地等待着一个速度缓.
阅读全文
摘要：jStat是一个Javascript库，为开发人员提供了统计功能和在浏览器中绘制相应图形的特性。jStat能够在所有浏览器中执行统计操作，它需要jQuery和绘制数据的插件。jStat是开源统计语言和环境R的部分移植版。 InfoQ采访了Matthew Williams（英国伯明翰阿斯顿大学研究员、jStat团队成员），了解jStat提供的功能： jStat的核心基于向量和矩阵（很像MatLab）。基本单元是矩阵，可以通过jStat函数(j$)来创建： § var matrix = j$([[1,2,3],[4,5,6],[7,8,9]]) 每一个矩阵包含许多方法，包括加法、除法、乘
阅读全文
摘要：随着电子商务的成熟，国内涌出了很多B2C网站，我经常访问的有：当当网、1号店、京东商城、易迅网、为为网和新蛋网等。这类网站很好的利用了计算机技术、互联网技术、即时通信技术和物流渠道，实现整个商务过程中的电子化、数字化和网络化，让不少用户得以不出户购天下物。 在访问这些网站的过程中，我发现其首页的信息架构拥有一些共同特点，也有各自的特色，遂以京东商城、新蛋网和易迅网为例，撰粗评一篇，拿来分享。行文难免有个人主观色彩，欢迎指正。 三大网站首页基本结构 信息架构的主要目的是帮助用户找到他想要的东西，即Design for way finding。在访问一个电子商务网站时，我们一般会考虑到以下问题：.
阅读全文
摘要：本来昨天是想好今天写一个围绕CSS主题展开的文章，结合软件中面向对象的思想去理解CSS。会比较新颖！但想想在深入理解CSS前，不是要把HTML再拿出来炒炒！作为一个搞网站的人(自己给自己的定义一直就是个搞网站的)，你要是没有听说过css，那你肯定就落伍了。随着css已经成为网站必备的几大件之一，结构与表现与行为的逐渐分离，HTML语义化成了炙手可热的卖点。语义化的HTML首先要强调HTML结构一个...
阅读全文
摘要：在博客园的知识库里面看到这篇文章，找到原文，我也说怎么写得这么专业呢，原来是出版百度泛用户体验的博客，与我很久以前看的一篇“面向对象的CSS ”观点有点类似，都是把软件开发中的一些理论与前端开发结合起来就发挥出巨大的威力。有空我把那篇也贴出来。 全文如下： 模块化概念 模块化就是为了减少循环依赖，减少耦合，提高设计的效率。为了做到这一点，我们需要有一个设计规则，所有的模...
阅读全文
摘要：别误会不是打算去携程网应聘，只是我个人打算在前端方面朝着这个招聘要求去努力 ！ 携程网：资深Css前端设计师 职位描述：您是否也认同这样的观点: 凭借激情, 勇气, 兴趣, 专注和悟性, 在现在或不远的将来能够设计出伟大的, 有前瞻性的, 充满创意和灵性作品. 当然要达到这一步, 还要依靠对工作的激情, 热爱和兴趣, 这些工作包涵但不限于:* 业务分析* 界面设计* 用户体验的分析研究.* 代码优...
阅读全文
摘要：CSS Drop-Down Menu Framework是一个基于GNU General Public License开源的纯CSS下拉菜单框架，能在IE5+、Firefox1.5+、Safari2+、Chrome1+和Opera7+这些浏览器上运 行，但在IE6和IE6之前的浏览器里是通过JavaScript辅助的。你可以修改它，以应用在你的网站。CSS Drop-Down Menu Frame...
阅读全文
摘要：这张图好像是我去年画的，当时是看了QQ介绍其拼音的一篇文章。其实这个也符合当今一些互联网项目的一般开发流程。
阅读全文
摘要：在单位新进的同事桌上看到了这本书。09年底出版的一本书，看到书名兴趣减了大半。"标题党"作者：曾在迅雷做资深网站重构师，现在是腾讯网站重构师，蓝色理想经典论坛标准模块版主。下面比较牛的一句话是：“接触网站重构以来一直以“重构网站之前重构个人思维”的态度对待网站、追求网站结构完美语义性，一直以这个态度跟他人沟通交流，也很喜欢大家以这样的态度与之沟通”....
阅读全文
摘要：一：目的、方针、方法 我们做一件事情有个目的。或者我们为什么要去做一件事情。这是我们做一件事情之前不得不解决的问题。 创办一个公司有个目的，创办者不得不解决的问题。 创造一个网站有个目的，创造者不得不解决的问题。 只有清楚的解决了这个问题，才能制订出比较准确的目标，才能在总体上对所作的事情有一个大的逻辑。因此根据这个逻辑制定一套执行方针。根据方针策划 出实现方法。 在大逻辑下，执行正确的方针和...
阅读全文