Rekey's WebSpace

Just So So ...

Home Develop Life Music News 关于

loader,用来加载需要的资源

作者 :Rekey 发布时间 :August 9, 2010 分类 :Develop 2 Comments

就不多写了.总觉得这个东西很搓.

/*
loader,用来加载需要的资源
* */
var loader = {
	"Version" : '20100809',
	"path" : {
		"js":"/js/",
		"css":"/css/"
	},
	"stats" : {
		"smoothbox":{
			"js":"smoothbox",
			"css":"smoothbox"
		},
		"form":{
			"js":"form",
			"css":""
		},
		"humanmessage":{
			"js":"humanmessage",
			"css":""
		}
	},
	"fnList" : {},
	"use" : function(name,callback){
		if(this.getStats(name) == 'loaded'){
			callback();
			return;
		}
		this.fnList[name] = [];
		this.fnList[name].push(callback);
		this.load(name);
	},
	"setStats":function(name,type,stat){
		this.stats[name][type] = stat;
	},
	"getStats":function(name){
		if(this.stats[name]['js'] == 'loaded' && this.stats[name]['css'] == 'loaded'){
			return 'loaded';
		}
		if(this.stats[name]['js'] == 'loading' || this.stats[name]['css'] == 'loading'){
			return 'loading';
		}
		return this.stats[name]['js'] + ' + ' + this.stats[name]['css'];
	},
	"load":function(name){
		if(this.getStats(name) == 'loading'){
			return;
		}
		var _this = this;
		var widget = this.stats[name];
		var callback = function(){
			if(_this.getStats(name) == 'loaded'){
				var fnList = _this.fnList[name];
				for(var i = 0 , len = fnList.length ; i < len ; i++ ){
					fnList.shift()();
				}
			}
		};
		for(var i in widget){
			if(widget[i] == ''){
					this.setStats(name,i,'loaded');
			}else{
				var url = this.path[i]+widget[i]+'.'+i;
				this.setStats(name,i,'loading');
				_this['load'+i](url,(function(i){
					return function(){
						_this.setStats(name,i,'loaded');
						callback();
					}
				})(i));
			}
		}
	},
	"loadjs":function(url,callback,context){
		var oHead = context || document.getElementsByTagName('head')[0];
		var oScript= document.createElement("script");
		oScript.type = "text/javascript";
		oScript.src = url+'?t='+this.Version+'.js';
		oScript.onload = oScript.onreadystatechange = function(){
			if (!this.readyState || this.readyState == "loaded" || this.readyState == "complete") {
				callback();
			}
		};
		oHead.appendChild(oScript);
	},
	"loadcss":function(url,callback){
		var oHead = document.getElementsByTagName('head')[0];
		var oCss = document.createElement('link');
		oCss.href = url+'?t='+this.Version+'.css';
		oCss.rel = 'stylesheet';
		oCss.type = 'text/css';
		if(!Browser.Engine.trident && callback){
			callback();
		}
		if(Browser.Engine.trident && callback){
			oCss.onreadystatechange = function(){
				if (this.readyState == "loaded" || this.readyState == "complete") {
					callback();
				}
			};
		}
		oHead.appendChild(oCss);
	}
}
标签 : javascript

奇异的代码一段.

作者 :Rekey 发布时间 :August 5, 2010 分类 :Develop 7 Comments

大家用稍微牛逼点浏览器去测试下这段代码吧.CSS还是很牛逼的.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>test</title>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<style type="text/css">
#a{width:100px;height:100px;border:1px solid #666;background:#ccc;}
#b{width:100px;height:100px;border:1px solid #333;background:#666;margin:10px}
#a:hover + #b{
    background:#eee;
}
</style>
</head>

<body>
<div id="a">aaa</div>
<div id="b">bbbb</div>
</body>
</html>
标签 : css, html

易联主机招聘,销售代表

作者 :Rekey 发布时间 :May 12, 2010 分类 :News 2 Comments

销售代表

职位描述:负责本公司网络推广以及销售业务
技能要求:

  • 熟悉互联网,
  • 四年以上网络经验
  • 从事过网络行 业
  • 最好做过个人站长
  • 有良好的网络人际关系和人脉
  • 熟悉各类PHP程序
  • 曾使用或接 触过Directadmin控制面版
  • 了解和基本掌握Linux以及MySQL的基本应用

销售及客服是绑定的, 一对一的客户服务理念.

1000底薪+奖金+全勤+电话补助(+自带笔记本有笔记 本补助) + 10-20%高提成 工作轻松(标准8小时工作时间), 对中国网络国情比较了解的优先考虑,对网络行业有极度的热情度优先, 能和客户良好的沟通优先考虑,对互联网销售有良好经验!

如果你具备了以前的要求,请尽快联系我,或者发个人简历到下方信 箱! 发完我会安排面试来和你面谈!

信箱

工作地点 通州西门 怡佳家园

标签 : 招聘

CSS开发模式

作者 :Rekey 发布时间 :April 23, 2010 分类 :Develop 2 Comments
CSS结构图

CSS分为三个部分

  1. Reset
  2. Layout
  3. Mod

CSS Reset : 通用设置,不需要处理.

CSS Layout : 根据设计稿定义的布局定义好整体布局,不频繁改动.

CSS Mod : 各种模块集合.

Reset 和 Layout 作为核心CSS定义.直接影响全局页面展示.所以不轻易进行修改.

Mod 为各个模块的集合.每个模块的CSS只控制模块内部展示,不对外部影响.

CSS关键字列表


由于模块元素的具有很多共同的元素,但是可能表现方式是一致的.所以需要定义一些自身定义的CSS关键字列表.在定义css关键字的类的时候不造成全局影响.

如Author , Title , time 之类的

Mod 开发


每个Mod的相关代码只影响Mod自身,不影响外部展示,比如

html代码:

<div class="mod-a”>
	<span class="img">
		<img src="demo.jpg" alt="" />
	</span>
	<div class="info">
		<a class="title" href="#">item title</a>
		<a class="author" href="#">item author</a>
	</div>
</div>

如果要控制title和author的展示, 使用

CSS代码:

.mod-a .title{
	Color:#f60;
}
.mod-a .author{
	Color:#06f;
}

以用来保持只对mod-a内元素的控制

文件结构

  1. Style.css
  2. Base.css
  3. Mod-a.css
  4. Mod-b.css

Style.css作为一个统一的页面css,加载在页面当中.

Base.css 包含CSS Reset 和 CSS Layout ,作为基本样式

Mod-a.css , Mod-b.css 负责每个mod的样式.由不同的团队成员维护

Style.css包含代码

CSS代码:

@import url("base.css");
@import url("Mod-a.css");
@import url("Mod-b.css");
标签 : css, webrebuild

走有中国特色的网站重构道路2

作者 :Rekey 发布时间 :April 22, 2010 分类 :Develop 18 Comments

标题跟twinsen的走有中国特色的网站重构道路一样,实际上,一切都是幻觉,我要说的是另一件事情

引用下twinsen的言论先:

<div class="f14 cf60 fright">xxx</div>
肯定是14px大小 颜色f60
然后不改动html的时候改变样式,呵呵,SB了

他的言论其实是个引子,因为现在很流行这种开发方式

css代码:

.f14{
  font-size:14px;
}
.cf60{
  color:#f60;
}

html代码:

<div class="f14 cf60">14px的文字大小,颜色值是#f60</div>

于是乎,写html代码就真的变成了累积木的举动了.
大家一起高呼,哇,原来重构就这么容易啊.
等到某天.需要把某个div的颜色换成#333,傻逼了.这怎么改.改html.
顺便让asp,php,jsp,asp.net等各种程序员改改程序页面.
我举这么个例子不是想说这种思想错误.

只是我想突然想到一个问题.能不能换一种思维来想这个事情,尽管可能现在做不到.
以下代码是从未在css里出现过的..

诡异的CSS代码:

.f14{
  font-size:14px;
}
.cf60{
  color:#f60;
}
.mod{
  include: .f14 , .cf60;
}

并不诡异的html代码:

<div class="mod">14px的文字大小,颜色值是#f60</div>

这种方式我称之为零件式开发.
很简单,做一些.f14,.cf60之类的小零件,然后让模块(也就是.mod之类)在css中包含,然后体现在表现当中.
这样做,是否可以继续累积木,但是又不会累出问题呢?

再次引用twinsen的话:

时刻铭记你不是一个“页面仔”,是一个重构工程师;或者更进一层,你在影响人类信息化社会的发展。
标签 : css, html, webrebuild
1234...10