Front-End
文章平均质量分 75
liyichaodoom3
这个作者很懒,什么都没留下…
展开
-
关于微博中的用户体验提升的点滴
最近在家天天都在做自己的毕业设计——Flowg微博系统。 先献丑放出一张系统的logo,自己用PS的钢笔做出来的(能说出这个logo的意思的有奖!呵呵,玩笑) 好,接下来进入正题,对于微博中的一些用户体验的提高写一些感想,这次的毕业设计的前端部分全部是自己用jQuery库+自己编写的插件实现的。在做系统之前对新浪微博,TX微博还有淘宝的掏浆糊进行过体验。总结出几点需要实现的。...原创 2011-01-08 12:12:03 · 199 阅读 · 0 评论 -
YUI2.8相关核心源码浅解及学习笔记(二)
晚上接下去写event这一模块。。。这一篇可能要详细的讲讲YUI中的观察者模式[b]二、event模块[/b]首先看下YUI封装的Event事件绑定机制:最核心的一个函数便是addListener,这个函数除了第一个需要传入元素外其他形式参数的和jQ的bind一模一样,这里还是要注意第一个元素传入可以是id值数组使用方法也比较的明了,注意YUI这里定义有一个简写为on的...原创 2011-03-09 23:18:38 · 193 阅读 · 0 评论 -
nodeJs初探
一直对NodeJs有很大的兴趣~趁着今天公司里的事不多趁机学习下~特地带来了笔记本(笔记本里装了Ubuntu),NodeJs是基于V8Js引擎的服务器端的Js环境,算是一个中间件,底层还是由C/C++实现的。以前对于前后端的数据验证神木的都要做两层,即在Js端要做一层数据交互验证,而在服务端由于用户可以禁用JS,所以服务端必须额外的对数据进行一次验证,效率阿。。。。。有了NodeJs...原创 2011-07-04 11:46:53 · 235 阅读 · 0 评论 -
Xvfb+YSlow+ShowSlow搭建前端性能测试框架(转)
淘宝UED里的大牛写的~~非常好的一篇文章~~工具介绍Xvfb: 主要就是通过内存计算模拟出图形界面,没有平常所见的操作界面,分为客户端和服务器YSlow: 当Firefox浏览网页时,可以分析网站的页面(基于Yahoo 14条评分原则),并指出如何进行优化提高网站性能ShowSlow:收集YSlow的测试结果并显示出来Ubuntu:开源的Linux系统,...原创 2010-11-06 22:21:59 · 211 阅读 · 0 评论 -
Web 2.0 工具箱
原文地址: http://www.dezinerfolio.com/2007 ... designers-tool-kit/链接数量很多,翻译不全欢迎大家查漏补缺。个人比较喜欢js特效库。分类一、DHTML AJAX Javascript 【Ajax脚本库】1. RO Scripts - Growing Collection of Scripts under various categories每...原创 2010-11-28 11:00:40 · 751 阅读 · 0 评论 -
浅谈块元素绝对定位的margin属性
对于div的绝对定位一直以为margin属性是无效的,只是通过top,left,bottom,right定位,然而今天的却发现不是这样的,于是对其做了些实验: 使用的HTML原始测试文件: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DT...原创 2010-11-28 13:42:18 · 323 阅读 · 0 评论 -
关于非表格的等高列的探讨
这里先纠正一下《精通CSS:高级Web标准解决方案(第二版)》一书中P175和P176中 margin-bottom:500px;这行代码,纠正为margin-bottom:-500px。 恩,上面这本书的第一版看过,最近把第二版的书买来过了一遍,的确是大师级别的值得放在案头的一本书,里面讲到的很多东西都是现在很流行的Web技术,里面的案例很值得慢慢品味,今天我想讲一下关于非表格的等高列的...原创 2010-12-06 17:49:18 · 132 阅读 · 0 评论 -
前端模块化探索(YUI篇)
接近一个月没写博客了,这次准备写几篇模块化的文章~ 对于模块化java应该是这方面做的最好的,通过import加上包管理就能完全的拥有一套模块化的结构。另外在php5中引入的class机制也使php颠覆4以前的过程化编程模式,使php也拥有了模块化机制。 最初的js只是用于一些增强页面效果,在经历了静态html时代 - LAMP时代 最后到了现在的WEB APP的时代,现在的Web应用已...2011-07-31 08:50:19 · 265 阅读 · 0 评论 -
前端模块化探索(jQuery篇)
YUI是针对与企业级的js框架,在模块化上做的还是比较靠前的,相比之下,jQuery是比较轻量级的库,jQuery中的模块更可以说是jQuery插件模块,但是再jQuery中的插件模块系统有一些缺陷: 一)、没有所谓的命名空间机制,覆盖重名的风险问题 二)、插件机制的方法($.fn)或是全局方法($)都是直接插入全局的命名空间jQuery下,其中fn方法是完全挂靠在jQuery对象上,每...原创 2011-07-31 10:12:48 · 168 阅读 · 0 评论 -
Tab切换和诡异的交互之讨论
刚来公司很多事情都要学习~~这几天在做一个需求项目时碰到了一个交互的问题: 有如下视觉交互稿: 这边的Tab切换头部根据规范只能放一个ul中的li实现,想当然的情况下对于当前Tab采用左右边框处理,在未触发的Tab中采用一个靠右的背景作为分隔符标示。大致代码如下,目标是在未改变下列html情况下实现上述交互~ <ul class="tab-title"> &l...原创 2011-03-29 22:04:56 · 111 阅读 · 0 评论 -
阿里云手机应用开发点滴
前些天参与了阿里云手机应用开发,现在应用上线了,也想写一些自己对于云应用开发的一些心得。 云应用开发我理解是以html与js对应与android里的xml与java开发模式的一套映射性质的开发模式。其中很多东西都继承了android开发的理念,比如android里的activity对应了云应用里的page,另外是整个page的生命周期的思想也基本了android的理念。下面就与android...2011-10-31 12:50:55 · 393 阅读 · 0 评论 -
云应用开发另一些细节总结
写一下前些日子云app开发的遇到的一些细节问题。 1、scrollview的问题 首先是关于scrollview这个类的。观察了已经上线的一些云应用,对于scrollview都好像没有处理的太好。这个view是绑定在容器上的一个滑动组件,但云app不像android在对组件的调用时只需要代码写好就可以了,云app更多的还需要DOM的格式问题。在这个问题上很多应用都会出现类似与滑...原创 2011-11-21 21:50:40 · 115 阅读 · 0 评论 -
【FE】Qunit整合seajs单元测试组件
前些天在项目中由于要用到单元测试,包装了一个基于seajs的Qunit单元测试框架,看了下Qunit的源码,发现Qunit直接支持CommonJs模式的封装: 如是,直接移植到seajs下 define(function(require, exports, module) { require('tests/qunit/qunit.css'); //Quni...原创 2012-02-23 14:35:15 · 129 阅读 · 0 评论 -
YUI2.8相关核心源码浅解及学习笔记(一)
文章写的太长了,分几部分好了,接着上面刚讲的,接下去是DOM模块[b]一、DOM模块:[/b]一般的js框架肯定少不了的几大模块之一,YUI的dom模块的确是没有像jQ做的那么神奇的感觉,但它却是众多dom框架的鼻祖之一。那就来看看:首先是$()的YUI版本:get()[b]1、get(ele)[/b]这边源码不贴了,与jQ强大的$来说get只能取到ID值,...原创 2011-03-09 19:33:47 · 259 阅读 · 0 评论 -
YUI2.8相关核心源码浅解及学习笔记(零)
上班前这几天得学习下公司的核心框架之一YUI2.8了,这个框架的确和以前专门用的jQ有很大的不同,代码量上去了,但设计模式等方面是相当优雅,粗略学习了下API和源码架构~~写一下对于YUI核心的一些东西学习的笔记摘要。(小弟写的不好~~轻拍)[b]零、Yahoo全局文件[/b]首先从核心文件yahoo.js开始:核心文件主要是定义了yahoo一些全局的方法:[b]1. Y...原创 2011-03-09 17:29:55 · 228 阅读 · 0 评论 -
关于文本域中光标定位问题
这次总算把系统前台中一个关于光标定位的bug给解决了~~~这里的文本框选择的对象在JS 的API文档中貌似没有仔细讲,而且犀牛书中也对此只是一笔带过。。。网上查了蛮多的资料,下面总结一下废话不说,直奔代码:(以jQ插件写的,外闭包省略) /** * 设置光标指针工具函数 * @param {mix} pos */ $.fn.setFocus = function (po...原创 2011-03-06 22:35:02 · 665 阅读 · 0 评论 -
Yc右键一键压缩Js文件
总是要把js文件压缩~~有了这个便轻松了~~~准备 压缩 JS 使用的是 YUI Compressor,需要 Java 运行环境支持,因此需要先安装 Java 运行环境。下载 YUI Compressor:http://yuilibrary.com/downloads/download.php?file=2a526a9aedfe2affceed1e1c3f9c0579下载后解压,把 yuico...原创 2011-05-09 14:35:36 · 171 阅读 · 0 评论 -
小试sina微博weibo-js API应用接口
前些日子的毕业设计的系统做了自己的api开放平台,趁此机会也学习下sina的api,昨天花了一个晚上加今天一个晚上搞了个weibo-js的demo,也顺便得出了一个结论:“这个API很坑爹!!!” 几个问题: 1、首先如何在本地开发js版本的api应用,需要架设虚拟主机加HOST绑定,具体文章如见我《本地架设测试型apache虚拟主机》这篇文章http://leyteris.ite...原创 2011-05-09 21:40:38 · 217 阅读 · 0 评论 -
仿新版迅雷列表进场动画体验
迅雷7的用户体验确实不错~对它的list列表进场时的动画印象尤为深刻(具体自己体验)。下面前端技术实现一下这个特效。 第一步是要模拟一种渐缓FadeIn的效果,html代码就是一个ul列表。开始对所有的li都display:none $('li').each(function(index){ $(this).fadeIn((index+1)*300);}); 直接用...原创 2011-08-18 12:34:08 · 150 阅读 · 0 评论 -
总结交互组件创新的四种方式(转)
交互设计是一个创造性的工作,利用创新的方式漂亮地解决产品问题,是一个交互设计师价值的体现。当创新的交互设计被用户认可、被业界同行学习,更是一种巨大 的职业满足感。这种创新不一定是惊天地泣鬼神的革命性设计,一个小小的交互组件的创新就可以让产品体验增色不少。今天就通过一些案例聊聊交互组件创新的四 种常见方式,与大家共勉。一、滚动条的创新【重构法】[img]http://www.mi...原创 2010-10-27 20:16:49 · 472 阅读 · 0 评论 -
关于seajs模块间相互依赖调用的解耦问题
前端密集型项目中如果数据同步的量很大,往往需要对于多个组件进行数据同步,其中必会导致几个组件之间的互相依赖调用,在seajs中递归嵌套的调用组件会引起循环引用导致内存泄露。 比如有这样两个模块组件: //@file : module/buddy/friend-in-group/friend-in-group.jsdefine(function(require, export...2011-08-27 16:49:01 · 227 阅读 · 0 评论 -
关于JavaScript Interface 接口的实现探索
前几天花了些时间看了js大师Ross和Dustin写的js设计模式,的确是本好书啊,里面的东西讲的非常深入,对于js模拟java编程的模式有很大启发,对于对象的解耦也讲的非常细致,有时间这本书要细细的读一下,下面就书中关于JavaScript Interface方面的阐述下自己的看法。 首先JavaScript是弱类型语言,所以类型匹配问题很难追踪,同时,Js并没有像其他语言一样...原创 2010-10-31 11:16:32 · 380 阅读 · 0 评论 -
浅析jQuery核心架构中应用Closure的设计模式
用了很久jQuery,到最近,等到自己想写一个链式库时才对它的内部架构学习了一下。下面就对jQuery框架设计模式的一些感想写一下: 首先是jQuery将自己所有的代码封装在一个闭包内;用闭包防止命名空间的变量污染,继续在本身闭包中初始化了一个名为jQuery的自动运行闭包函数;形如: (function(window, undefined){ var jQuery =...原创 2011-02-03 18:36:14 · 141 阅读 · 0 评论 -
IE6中a标签无法监听到点击事件的总结(转)
IE6 这个必须死的浏览器实在是让人崩溃。。。对于a标签无法点击的bug遇到过N次也是一知半解的简单的添加背景图解决,这次正好在网上看到了一篇总结性的好文。搬过来~~ 情况一 <!--这是 <a> 标签所在容器的背景上画了一个按钮,需要能点击跳转的情况--><a href="http://leyteris.iteye.com/" style="d...原创 2011-09-15 20:26:10 · 234 阅读 · 0 评论 -
【nodejs】nodejs版seajs压缩部署工具
项目中seajs模块化的使用开发的时候来的确省事很多,但seajs的机制导致的请求过多不适合线上直接部署,玉伯那儿有一个spm部署的工具,但后来得知当前这个spm项目可用性还不是很高。所以准备自行搞一套发布的机制。 seajs有两种define的形式: define(function(require, exports, module){}); 和 define("...2011-09-23 15:49:57 · 191 阅读 · 0 评论 -
浅探跨浏览器的本地缓存解决方案
最近对于HTML5中的LocalStorage以及跨浏览器的本地存储稍微研究了下~目前来说HTML5这个API还是能在以后又很大的作用,无论是Web App的离线存储还是对于流量的节约或者是用户体验的提高都是有很好的推进作用~ 但是市面上的浏览器貌似太多~比如像IE6 7 什么的不支持HTML5 api,于是乎就想研究下跨浏览器的本地存储~下面这张图是比较流行的跨浏览器解决方案:...原创 2011-06-23 15:21:52 · 388 阅读 · 0 评论 -
Ajax保留浏览器历史的两种解决方案(Hash&Pjax)
总是在github down点东西,github整个界面做的不错,体验也很好~对于其中的源代码滑动的特效最为喜欢了~刚开始以为这个只是普通的ajax请求效果,但是发现这个特效能够导致浏览器地址栏跟随变化,并且再点击前进后退按钮后又可以将代码滑回滑出~~于是乎就来研究下吧~一、通过锚点Hash实现: 在这方面其实国内很早就有做了,比如淘宝画报,通过的是在地址栏后面加#锚点实现的,浏览器是可...原创 2011-06-28 14:29:16 · 137 阅读 · 0 评论 -
IETester整合Firebug集成测试
对于系统中一个IE6 UI显示中的bug实在有点无语~~操家伙~~PS:以前对于IE6BUG都直接硬调还是能调出来的,这次的BUG调了好久,IE6就是显示有问题,无奈~~ 这里有一种比较好的IE调试的工具IETester。。。相信一般前端工程师都知道,那就把它结合FireBug来强强联手吧~~ 这里需要安装一个Debugbar软件,以前还真没装过。。。在这里下载:http://files...原创 2011-03-05 15:53:16 · 98 阅读 · 0 评论 -
【FE】来往前端实践——方凳会分享Presentation
上个月在方凳会上的分享~~放博客上备个份主题:来往前端实践Presentation地址:http://prezi.com/-lu-ugicpknt/presentation/ 分享者:李毅超(@Leyteris)...原创 2012-03-07 14:03:56 · 192 阅读 · 0 评论