- 博客(42)
- 问答 (1)
- 收藏
- 关注
RSS订阅livereload自动通知页面重刷新的轻量级server
概述： 它是一个基于node的轻量级web server。它可以监听你的css、js、html文件变化自动通知浏览器刷新页面，或者重新载入css文件。它最大的特点就是不用你手工修改html或者使用浏览器插件来建立前后端通讯，而是动态的在html中插入一段无干扰的JS。如果你是做一些前端的练习或者建立前端的测试页面，那么它就很有用了。 安装:安装node 0.60+（自带npm...
2012-05-20 19:02:05
207
原创 纯css3做的太阳系演示
[url=http://neography.com/experiment/circles/solarsystem/]猛击进入[/url]在webkit核心的浏览器上还能看到行星自转、公转，我觉得它真的很酷 :lol: [img]http://dl.iteye.com/upload/attachment/288507/12276511-8463-33c2-bfd5-7da237d7c7d8....
2010-08-05 10:48:46
362
互联网前端模块化的一些思考
[size=large]前段时间参与了我的第一个互联网项目——公司主页改版，主要是负责前端的组件实现（html+js+css）。为了响应领导使用YUI的号召，项目中引入了YUI的延迟加载机制，再加以jquery做为底层库以及一些简单的UI组件，就构成了我们的UI组件库。实现过程没什么难度，不过使用过程却碰到不少问题。1.页面加载中组件样式错乱。这是因为延迟加载样式造成的，如果css文件加载...
2010-08-02 14:55:01
153
原创 几个我常用的浏览器插件
[list][*]chrome的网页截图扩展:[url]https://chrome.google.com/extensions/detail/alelhddbbhepgpmgidjdcjakblofbmce?hl=zh-CN[/url]操作方式跟QQ截图差不多，特点就是可以直接上传到网上并与他人分享，省去了保存到本地再上传的麻烦。[img]http://dl.iteye.com/...
2010-07-25 18:29:41
172
原创 关于UI组件加载策略的思考
[size=large] [color=orange] 1.YUI的延迟加载策略是否适用于我们的网站？[/color][/size][size=medium] 1)如果组件负责布局样式的话，组件样式的延迟加载会造成布局的错乱，这会延迟用户获取有用信息的时间，降低用户体验。 2)延迟加载会增加组件升级的成本。如果对组件进行重构的话其它适用该组件库的项目也需要同步重构，这个过程...
2010-07-21 10:54:45
92
几款前端开源flash报表比较
1.YUI(Ext)-chart其实Ext的chart组件来自于YUI2的chart组件，不过就是Ext做了一点自己的封装罢了，从它们的官网的示例和API你就会看出他们出奇的相似，话说YUI的chart组件也是基于另外一个开源项目。优点：纯JS配置，事件定义多，可以方便的与其它组件交互缺点：图表种类少（没有AreaChart导致我只能放弃）、配置不方便2.dv-charts一款使用xml进行配置的...
2010-06-27 03:46:55
210
原创 Linux下安装python3.1
[size=medium]公司Linux自带2.4版本的python，尝试yum升级未果（下载到几个补丁）。遂下载Python3.1，根据readme安装完并设置好PATH命令行下输入python结果发现还是2.4版本的，焦头烂额之际想到是否可去卸载之前的python，搜索python文件发现新装的python可执行文件已改名为python3，于是在命令行输入python3，看到了python3的...
2010-06-26 23:10:43
278
[CSS]不用hack的css动态布局方案，兼容主流浏览器
[size=medium][b]优点：[/b]1.不用hack，易于理解和维护2.可通过设置容器宽高来改变内部元素，免去定死宽高的烦恼[b]注意：[/b]1.容器的高度不包括上下部分的高度2.调整内部元素宽高需要调整外层div的padding属性3.多出了2px的地方是因为设置了border属性,通常是没有的[/size][code="html"] ...
2010-06-14 22:06:49
80
使用YUI框架的一些感受
[size=medium]总结起来只有六个字：[b]难看、难用、难改[/b][list][*][b]难看[/b]：YUI3暂时还没几个widget，就说YUI2的。我第一次看到的YUI组件是calendar组件，当时我就傻眼了，UI竟然可以做的如此难看 :cry: 后来又看了YUI的Tree组件，发现不光是难看，叶子节点前面竟然还有可收缩的图标 :x [*][b]难用[/b]：...
2010-06-10 22:51:00
446
原创 How to use YUI2 in YUI3 locally
1.download YUI3.1.1 and YUI2in3(http://github.com/yui/2in3)2.include the JS below before the YUI() function[code="js"] YUI_config = { groups: { yui2: { ...
2010-06-02 19:48:06
113
[YUI示例]YUI Core
公司要做公网的网站，目前前端框架选定YUI，通过两天学习我发现YUI这个库理解起来一点不比Ext简单，里面很多比较复杂的函数，没有一两个月估计很难有个基本的理解。还是先从最简单的例子学起吧。[code="js"]YUI().use('node' ...[/code]YUI()函数负责生成一个YUI实例并返回，在参数里可以设置一些配置项，例如debug什么的，这里我们什么都没设置。'no...
2010-05-30 17:41:38
117
原创 [Ext入门]如何学习Ext
国内使用Ext的可谓不少，但是多数也只限与使用其中示例，真能把Ext理解透彻，尤其是能做到定制组件、内存优化的人恐怕就不多了。经常听到有人说Ext难学，我却觉得能不能学好主要还是在于基础，主要是JavaScript、Html、Css，只要你能把里面的基础概念都理解了，学习Ext也不是什么难事。以下几点来自个人经验以及官网blog上的建议。[list][*]打好基础，推荐http://www...
2010-05-29 19:26:02
206
原创 [Ext重写]必填项的label后面加星号
[code="js"]Ext.form.TextField.override({ initComponent: Ext.form.TextField.prototype.initComponent.createInterceptor(function(){ if (this.allowBlank === false &...
2010-05-20 15:49:21
247
原创 [Ext重写]限制树的深度
以前做政府项目的时候经常涉及行政区划的树，这个树有的时候要显示到旗县级，有的时候要显示到盟市级，当时靠后台来实现，代码写的非常繁琐（要配url、写controller），灰常简单的事情弄得嗷嗷复杂，终于，当我读明白源码之后一切问题迎刃而解 :lol:首先要把下面这段JS加入页面 [code="js"]Ext.tree.TreeNode.override({ appendChi...
2010-05-19 00:51:43
108
原创 利用闭包实现的方法拦截器
该函数可以让你轻松获知任意函数的传入参数和返回值 :lol: 注意：该函数使用需要Chrome控制台或者Firebug[code="js"]App = function(){ function getResultFn(name, fn){ return function(){ ...
2010-05-18 17:43:15
105
原创 [JS基础]Javascript的this在Ext中的应用
如果你只是使用Ext做些小样子，那么你完全不必理会this（Ext的官方例子里面也基本上很少用这个关键字，因为这个原本在其他语言中非常简单的东西在Javascript却变得有时候让人难以捉摸）；但是如果你想了解整个Ext框架或是编写可重用的js组件，你就不得不认识清楚这个关键字了。要点：[list][*][b][size=large]全局环境下this指向window对象[/size]...
2010-05-17 00:27:18
183
原创 一个可以用来测试后端返回数据的java工具
调试AJAX程序是件麻烦事情，为了了解服务器返回的信息我们需要打开浏览器进行调试，且不说浏览器占用内存，每次输入一堆数据就是件麻烦的事。这段程序其实是《java核心技术》上面的一段示例，做了一点修改以解决utf-8环境下中文乱码的问题[img]http://dl.iteye.com/upload/attachment/246148/03e73cdd-1ea8-3039-8a97-b36ae...
2010-05-08 19:18:12
399
原创 借助css定位实现动态关联的一个例子
[code="html"] Untitled Document #manager { height: 200px; } .server { height...
2010-05-07 18:32:50
134
[Ext源码]Ext的核心方法
Ext.extend方法：[code="js"]extend : function(){ // inline overrides var io = function(o){ for(var m in o){ this[m] = o[m];//io的调用对象将获得o...
2010-05-07 01:17:44
87
[Ext插件]QM.plugin.MutilTreeFilter：为树添加过滤、展开、收缩功能
先来看看Ext的官方API的左上角[img]http://dl.iteye.com/upload/attachment/243061/abd3e241-75c3-38bb-8dce-b0aa487b169e.png[/img]本插件基于Ext3.0 可以非常轻松的实现上面的功能，你只需要为你的树配置一下插件，例如：[code="js"]plugins: ['multifilter'...
2010-05-01 19:48:10
176
一个图片浏览的小组件，支持全方位调整和拖拽
[b]功能：[/b]双击页面图片弹出一个内含图片窗口，可进行全方位调整和拖拽[b]特点：[/b][list][*]基于Ext-core，面向组件形式开发，不会与其它JS发生冲突[*]支持主流浏览器，已测试ie6、FF、chrome[*]全局单例模式，部分组件重用，事件注册优化，最大限度降低内存消耗[*]精心布局，考虑了页面存在滚动条的情况[*]使用特别简单[/lis...
2010-05-01 03:02:05
209
[Ext入门]图文详解Ext常见开发工具的安装使用
俗话说，工欲善其事，必先利其器。缺乏好的工具想要用好Ext这么庞大的类库恐怕任谁都很难做到，本文就来介绍几种Ext的智能提示工具。btw，今天非常不爽，Aptana不知为何怎么都起不来了，重装无聊之余有了此文...[b]第一种方式Aptana支持[/b]1.下载Aptana[url]http://www.aptana.org/studio/download[/url][img]...
2010-04-27 21:28:11
270
[Ext扩展]动态分页大小、动态grid高度、本地数据分页三合一
[b]Ext.ux.plugins.PageComboResizer：[/b]PagingToolbar插件，添加一个分页提供大小选择的ComboBox[code="js"]bbar: new Ext.PagingToolbar({ pageSize: 10, store: store, displayInfo:...
2010-04-27 02:53:44
201
[Ext扩展]两个来自Ext官方论坛的时间控件扩展，可选择时分秒
为方便大家使用，我把控件所需的js、css、gif文件都提取出来了，示例可以直接放到Ext根路径下用浏览器打开查看运行效果。这个组件适用于Ext3.0以后版本，2.0肯定跑不了的[b]第一个[/b][i]使用方法示例：[/i][code="js"]{id:'time',xtype:'datetimefield',format:'H:i'}[/code][i]...
2010-04-26 22:55:32
113
[Ext扩展]QM.ui.TreeCombo：多功能下拉树列表，内含文档与示例
有句老话叫不重复造轮子，既然网上已经有下拉树的扩展，为什么还要再做一个呢？答案很简单，网上那些满足不了我的需要。简单来说，本扩展UI组件具备以下功能：[list][*][b]宽度自适应[/b] 下拉列表宽度可根据树的大小进行自动调整[*][b]延迟加载[/b] 默认采用，提高页面渲染速度[*][b]自动寻路[/b] 下拉列表展开时会将选中树结点的按其路径展开[*][b]键盘导航...
2010-04-26 20:12:09
142
[Ext扩展]QM.ux.TreeFilter：树节点智能过滤,添加中文模糊匹配功能
Ext自带一个Ext.tree.TreeFilter类，可以实现树节点的过滤，但是功能太单薄了。我自己实现了一个树的过滤功能，支持以下功能：[list][*]过滤时忽略父节点，默认情况下忽略[*]中文、拼音首字母过滤，你输中文就按照中文进行匹配，输拼音就按照首字母匹配[*]过滤后自动展开匹配结点的所有父节点[*]匹配字符串为空时将结点全部显示，可配置全部显示时结点状态为全收缩还...
2010-04-26 18:24:30
157
[组件用法]Ext.state.Manager对组件状态进行管理
Ext.state.Manager存在的意义：简单说就是在客户端存取数据，譬如说用户打开一个Window之后对其大小进行了调整，他不想每次打开都要重新调整窗口大小，这时你就可以使用Ext.state.Manager记住他所设定的窗口大小，这样他即使关闭浏览器再打开打那个Window还会是你所保存的大小。默认情况下所有组件执行构造函数时都会访问这个类。如果你想要让它记住组件的状态必须在程序初...
2010-04-20 01:44:34
450
[Ext插件]PinyinFilter：使用拼音首字母对数据进行过滤
这个插件的目的在于提高用户对于数据的选择效率。经常录入数据的人肯定能明白，在一长串列表中选择你想要记录是一件很费眼神的事；记得当初玩开心网可以按拼音首字母找到自己的好友，当时就觉得很是方便。如果您想提高用户对您软件的评价，请您考虑这个插件。[img]http://dl.iteye.com/upload/attachment/236916/e3ea789a-1c1d-306d-9b8b-39...
2010-04-19 00:37:44
322
[Ext扩展]根据后台json生成左侧导航菜单,5月9日更新1.1版本
文章内不再提供示例，需要查看者请从SVN下载，地址：[url]http://exttools.googlecode.com/svn/trunk/[/url]效果图：[img]http://dl.iteye.com/upload/attachment/235178/54a8876e-7bda-3433-b190-d954dafc4b10.png[/img][code="js"]...
2010-04-16 03:39:38
238
[Ext扩展]MenuToolbar：根据json串生成多级菜单
注意：html文件的Ext库引用请自行解决，效果图：[img]http://dl.iteye.com/upload/attachment/234459/bcc13ed4-ea76-3444-b1eb-50cf6777d459.png[/img][code="js"]/** * 该扩展可以通过一定解析规则的json串生成菜单 * 通过itemclick事件调用点击菜单项的...
2010-04-14 20:16:56
121
[Ext扩展]JsonTreeLoader：一次加载所有树节点更新1.1版本
仿照官网例子：XmlTreeLoader做的，下面有实例注意：html文件的库引用请自行解决[code="js"]/** * 通过读取JSON串生成树的层次结构,务必保证json数组中结点出现次序与树完全展开时一致！ * （通过后台对编码进行排序来完成） * JSON串根节点默认为'list' * 父结点id字段为 * * 注意： * 1.因为是一次加载全...
2010-04-14 19:58:16
206
[组件用法]Ext.History用法要点
在我的单页面试了下这个类的用法，发现这个类还是比较特殊的。说下详细用法：1.在页面加入如下隐藏域[code="html"] [/code]2.添加初始化方法，这个跟qtip一样：[code="js"]Ext.History.init();[/code]3.对于需要记...
2010-04-14 01:11:35
405
拒绝iframe嵌套，ajax方式轻松实现单页面
以前单位做的项目都是上面一排菜单按钮，每点击一次按钮下面工作区的iframe就到后台重新加载一次页面；这样做有很大弊端，其一是iframe经常会对弹出层造成遮挡（ie6下），其二是每个页面都有一个jsp页面（其实就是些js、css之类的引用）和js文件，维护起来很是不便；其三，iframe里的遮罩没法挡住整个屏幕区域。既然如此，我们就不能直接去下js文件把组件添加到页面上吗？答案是可以的，而且很简...
2010-04-13 00:00:52
475
[JS进阶]变量和方法分类
[list][*]私有变量：对象内部通过var声明的变量，外部不可访问。[*]私有函数：对象构造函数内部声明的函数，只能由特有函数访问到（包括构造函数）；[*]特有函数：特定运行对象具有的函数，例如this.methodName=function(){...}外界可直接访问[*]公共属性：this.variableName形式声明，外界可读写[*]原型方法：Classname....
2010-04-12 02:17:50
66
ie6下弹出层会被覆盖bug的解决
[img]http://dl.iteye.com/upload/attachment/232721/2e2e5a33-a1b5-3112-b9c3-ecda777b9960.png[/img]在层结点前方加入一个iframe结点;样式：.zindexDiv { position: absolute; z-index: ...
2010-04-12 01:04:13
77
兼容ie6、ie7、ff的css顶端固定位置定位
[code="css"]body{ background-image:url(about:blank); background-attachment:fixed;}.myDiv{ position:fixed !important; position:absolute; top:expression(eval(document.document...
2010-04-12 00:23:26
64
javascript实现螺旋数组
javascript版本，可直接粘贴到chrome控制台下运行， 二维数组方式实现最后是一行一行打印的； 支持顺时针和逆时针旋转； 不大喜欢递归，时间空间开销都大，而且还不易修改，算位置的话就纯数学了，我的数学不大好[img]http://dl.iteye.com/upload/attachment/232550/26fbb66e-5294-3d98-9e42-5ddbc5ef02...
2010-04-11 23:02:50
204
[Ext源码解读]事件的注册、添加与触发是如何实现的
Ext提供了一套强大的事件处理机制，每个组件都有许多事件，用户可以很方便通过动态的方式为对象添加/删除事件监听函数（在实例化的时候不是必须的），从而动态的改变或添加对象的行为，而这一切又是如何实现的呢？阅读前请您准备好Javascript基础知识（包括：prototype属性、Functin对象的apply和call方法、函数的作用域等）。该脚本剥离了许多分支逻辑，修改了大多数函数的实现仅...
2010-04-11 01:49:32
99
更贴心、更友好的用户提示，让alert见鬼去吧！更新1.2版本
玩过QQ开心农场的应该都见过，每次卖完东西都会闪出一个可以自动消失的提示，免去了alert提示用户点击确定的烦恼，用户的体验性更加的流畅。本脚本实现效果跟那个基本一样，如图：[img]http://dl.iteye.com/upload/attachment/232342/dda820a6-ac32-38cd-9d1f-82d1e19a59ee.png[/img]本脚本基于专为...
2010-04-09 15:50:11
188
Email自动完成控件
简介：根据用户输入文本框的内容在下方弹出一个完整Email列表供用户选择；用户可以按上下键进行选择，可以按回车键选中，也可以用鼠标点击选中；附件是一个小例子[img]http://dl.iteye.com/upload/attachment/231427/fdb803df-dd6d-357b-bd2a-e7981066fa5d.jpg[/img][code="js"]/** *...
2010-04-08 23:03:20
279
空空如也
如何用java单用户多线程查询数据库？
2010-01-04
TA创建的收藏夹 TA关注的收藏夹
TA关注的人