RSS
Twitter
Facebook
Google+
eMail七 22
在网站模板中用了一些HTML5的语义标签，用IE访问显示混乱，远离IE，从我做起！让我们一起对IE说不！！！
四有新人
本站不支持IE，谢谢
本站不支持IE，谢谢
七 22
在网站模板中用了一些HTML5的语义标签，用IE访问显示混乱，远离IE，从我做起！让我们一起对IE说不！！！
七 06
Web开发, 互联网 jQuery, WordPress 9 Comments
最近上人人网的时候，发现页面的底部有一个“返回顶部”的按钮，于是在自己的网站上也搞了一个，其实非常简单。
首先，修改主题模板的footer.php文件，</body>上面加入如下代码：
<div id="toolBackTo" style="display: none;">
<a title="返回顶部" onclick="window.scrollTo(0,0); return false;"
href="#top">返回顶部</a>
</div>
上面这段代码是完全Copy自人人网的源代码。返回页面顶端的代码很简单。
接下来修改style.css文件，加入上面div和链接的样式：
.back-to {
position: fixed;
bottom: 10px;
right: 10px;
z-index: 999;
width: 110px;
overflow: hidden;
zoom: 1;
-ie6-position-fixed-delay: 200;
}
.back-to .back-top:hover {
background-position: -50px 0
}
.back-to .back-top {
float: right;
display: block;
width: 50px;
height: 50px;
background: url(http://a.xnimg.cn/imgpro/button/back-top.png) no-repeat 0 0;
margin-left: 10px;
outline: 0 none;
text-indent: -9999em;
}
非常不好意思，这些代码也是原样copy自人人网。
.back-to就是div的样式，它的position设为fixed。这样它就会固定在页面的某个地方。在这里它的位置是bottom: 10px; right: 10px，就是右下角距离浏览器边角各10px的位置。
到这一步，基本功能已经实现了，当我们把页面滚动到下方的时候，点击这个按钮，就会自动跳到页面的顶端。
不过，当页面在顶端的时候，这个按钮其实没有存在的必要，我们可以用javascript来控制它。
再回到footer.php文件，在刚刚的代码下面加上如下代码。
<script type="text/javascript">
$(function(){
var bt = $('#toolBackTo');
var hl = $.browser.webkit ? $('body')[0] : $('html')[0];
$(window).scroll( function() {
var st = hl.scrollTop;
show = (st>30);
if( show ){
bt.show("slow");
}else{
bt.hide("slow");
}
});
});
</script>
这段代码用到了jQuery，所以需要先检查一下当前模板有没有引用jQuery，如果没有的话要在header.php里引用它。
我们给window对象绑上了scroll方法，在页面滚动的时候触发来控制返回按钮所在div的隐藏和显示。
代码非常简单。
七 02
互联网, 我的工作 Web, 浏览器 No Comments
浏览器的种类，如果按照生产商的品牌分，不说数以万计，起码也有成百上千种了， 如果按浏览器核心分类，它的种类就会少的多。
当今浏览器核心的种类值得一体的大约只有三到四个，它们分别是：Trident、Gecko、WebKit和Presto。
乍一看，似乎都很陌生，其实并不然，只要你上过网，就至少用过其中一种浏览器核心的浏览器软件，因为它们的市场占有率的确是太高了。
说起Trident，很多人都会感到陌生，但提起IE（Internet Explorer）则无人不知无人不晓，由于其被包含在全世界使用率最高的操作系统Windows中，得到了极高的市场占有率，所以我们又经常称其为IE核心。
Trident（又称为MSHTML），是微软开发的一种排版引擎。它在1997年10月与IE4一起诞生，至今经历12年，至少更新了四个版本，虽然它相对其它浏览器核心还比较落后，但Trident一直在被不断地更新和完善。而且除IE外，许多产品都在使用Trident核心，比如Windows的Help程序、RealPlayer、Windows Media Player、Windows Live Messenger、Outlook Express等等都使用了Trident技术。
但并不是所有的IE都使用Trident引擎，微软还有另一个网页浏览器排版引擎，叫做Tasman，它是使用在Internet Explorer for Mac的排版引擎，即苹果版的IE引擎。
使用Trident引擎的浏览器有很多，比如Internet Explorer、Maxthon遨游、世界之窗、腾讯TT、Netcapter、Avant等等，但Trident只能应用于Windows平台，且是不开源的。
Gecko也是一个陌生的词，但Firefox的名声应该已经有所耳闻，Gecko是一套开放源代码的、以C++编写的网页排版引擎。
目前为Mozilla家族网页浏览器以及Netscape 6以后版本浏览器所使用。这软件原本是由网景通讯公司开发的，现在则由Mozilla基金会维护。它的最大优势是跨平台，能在Microsoft Windows、Linux和MacOS X等主要操作系统上运行，而且它提供了一个丰富的程序界面以供互联网相关的应用程式使用，例如网页浏览器、HTML编辑器、客户端/服务器等等。
Gecko是最流行的排版引擎之一，仅次于Trident。使用它的最著名浏览器有Firefox、Netscape6至9。
webkit 是一个开源项目，包含了来自KDE项目和苹果公司的一些组件，主要用于Mac OS系统，它的特点在于源码结构清晰、渲染速度极快。主要代表作品有Safari和Google的浏览器Chrome。
Presto是由Opera Software开发的浏览器排版引擎，供Opera 7.0及以上使用。它取代了旧版Opera 4至6版本使用的Elektra排版引擎，包括加入动态功能，例如网页或其部分可随着DOM及Script语法的事件而重新排版。
Presto在推出后不断有更新版本推出，使不少错误得以修正，以及阅读Javascript效能得以最佳化，并成为速度最快的引擎，这也是Opera被公认为速度最快的浏览器的基础。
六 23
互联网, 我的工作 CSS, HTML, JavaScript, Web No Comments
Web 开发的分散性和交互性，决定了 Web 开发必须遵从一定的开发规范和技术约定，只有每个开发人员都按照一个共同的规范去设计、沟通、开发、测试、部署，才能保证整个开发团队协调一致的工作，从而提高开发工作效率，提升工程项目质量。
页面一定要有相应的Title，特殊页面可以不要；如Iframe页、Include页等
主要页面要有meta字段以便于搜索引擎查找，还可充当注释作用
尽量使用广泛支持的技术。以流行的浏览器及版本为标准，同时照顾低版本
不使用过小的字体不使用过大的图片、动画、声音、不使用过长的滚屏
及时删除无用文件，防止无谓的下载速度减慢、后期维护简洁明了
所有文件全部以小写字母命名，包括图形文件。禁止用中文作文件名
页面支持最低800X600屏幕分辨率（实际尺寸为778*434px），即不能出现横向滚动条
通常情况下页面应以居中为主，如有特殊要求可以设置居顶、居左
图片采用gif, jpg压缩格式，以减小页面下载数据量，<img alt="" />标记要有width,height属性
所有页面都需要定义背景颜色，系统默认值是可以被用户随意更改的
首页面必须是以index.htm 、index.jsp命名的文件，按目录划分
HTML文件扩展文件名一律用 .htm，不要同.html扩展名混用
除非有特殊情况，目录、文件的名称全部用小写英文字母、数字、下划线的组合，其中不得包含汉字、空格和特殊字符；目录名应以英文、拼音为主。尽量用一些大家都能看懂的词汇。
目录下新建css文件夹，专门用来存放本级目录的全局CSS样式文件
目录下新建image文件夹，专门用来存放本级目录的全局图片资源，如gif、jpg
目录下新建script文件夹，专门用来存放本级目录的全局脚本程序代码，如js、vbs
目录下新建media文件夹，专门用来存放本级目录的全局媒体文件，如flash、avi
目录下新建temp文件夹，专门用来存放本级目录的临时或测试资源文件
根目录下一般只存放index页面及其所包含的帧页面与一些公共页面，如error、wait
所有文件与目录尽量符合DOS系统8/3文件格式命名，即8字节文件名、3字节扩展名
在排布表格之前,请大家一定要好好思考一个最佳的方案,表格的嵌套尽量控制在三层以内,并且应该尽量避免 两个标记,经验表明,这两个标记会带来许多麻烦。
一个网页要尽量避免用整个一张大表格,所有的内容都嵌套在这个大表格之内,因为浏览器在解释页面的元素时,是以表格为单位逐一显示,如果一张网页是嵌套在一个大表格之内,那么很可能造成的后果就是,当浏览者敲入网址,他要先面对一片空白很长时间,然后所有的网页内容同时出现。如果必须这样做,请使用<tbody>标记,以便能够使这个大表格分块显示。
排版中我们经常会遇到需要进行首行缩进的处理,不要使用 或者全角空格来达到效果,规范的做法是在样式表中定义 p { text-indent: 2em; } 然后给每一段加上<p>标记,注意,一般情况下,请不要省略</p>结束标记 。
原则上,禁止用 <img alt=”" width=”?” height=”?” /> 来人为干预图片显示的尺寸,而且建议 <img alt=”" /> 标签中不要带上 width 和 height 两个属性,这是因为制作过程中,图片往往需要反复的修改,这样可以避免人为干预图片显示的尺寸,尽可能的发挥浏览器自身的功能；但是这样的一个副作用是当网页还未加载图片时,不会留出图片的站位大小,可能会造成网页在加载过程中抖动（如果图片是插在一个固定大小的表格里的,不会有这个现象）,尤其是当图片的尺寸较大时,这种现象会很明显,所以当预料到这种会明显导致网页抖动的情况会发生时,请大家务必在最后给 <img alt=”" /> 附上 width 和 height 属性。
为了最大程度的发挥浏览器自动排版的功能,在一段完整的文字中请尽量不要使用<br>来人工干预分段。
不同语种的文字之间应该有一个半角空格,但避头的符号之前和避尾的符号之后除外汉字之间的标点要用全角标点,英文字母和数字周围的括号应该使用半角括号。
请不要在网页中连续出现多于一个的半角空格, 也尽量少使用全角空格（英文字符集下,全角空格会变成乱码）,空白应该尽量使用 text-indent, padding, margin, hspace, vspace 以及透明的 gif 图片来实现。
中英文混排时,我们尽可能的将英文和数字定义为 verdana 和 arial 两种字体。
行距建议用百分比来定义,常用的两个行距的值是 line-height:120%/150%
网站中的路径全部采用相对路径,一般链接到某一目录下的缺省文件的链接路径不必写全名,如我们不必这样：<a href=”aboutus/index.htm”> 而应该这样：<a href=”aboutus/”></a>
为页面添加正确的DOCTYPE，过渡型（Transitional）、严格型（Strict）、框架型（Frameset）
设定名字空间（Namespace）
声明编码语言
用小写字母书写所有的标签元素与属性名字
为图片添加 alt 属性
给所有属性值加引号””
关闭所有的标签，包括空标签
用CSS定义元素外观
用结构化元素代替无意义的垃圾代码
给每个表格和表单加上id
所有的XML标记都必须合理嵌套
把所有<>和&特殊符号用编码表示； < > &等
给所有属性赋一个值，没有值的就重复本身
不要在注释内容中使用“–”
推荐定义font-family : “Lucida Grande”, Verdana, Lucida, Arial, Helvetica, 宋体,sans-serif;
辅助图片一律用背景处理
尽量多使用群选择器、派生选择器来书写具有层次结构的CSS样式
合理使用类别选择器与id选择器，同个ID只用一个地方，相同CLASS可用多个地方
链接伪类一定要按照a:link、a:visited、a:hover、a: active的顺序书写
多使用具有良好风格的注释，便于今后的维护与重构
一个标记必须占用一行 不得出现两个标记在同一行的情况(同一标记的关闭标记除外)
静态文件内容必须包含在标记中间
标记必须包含在标记中间
对于需要关闭的标记，必须同其关闭标记同时出现，不得出现交叉包含的语句
最高一级的父标记采用左对齐顶格方式书写
下一级标记采用左对齐向右缩进一个Tab的方式书写
在下一级依此类推，分别左对齐相对于父标记向右缩进一个Tab的方式书写
同一级标记的首字符上下必须对齐
常量以及全局变量名必须全部使用大写字母
变量名首字母必须小写
变量名必须使用其类型的所写字符串开始。各种类型的所写字符串如下：
整型变量：int；长整型变量：lng；浮点型变量：flt；双精度变量：dbl
对象引用变量：obj；字符串变量:str；Date类型变量：dtm
变量名必须采用有意义的单词命名
变量名除首字母小写外，其他单词首字符必须大写
如果变量名过长可以使用单词缩写，除了被广泛了解的单词缩写以外，所有使用单词缩写的变量名必须在定义时给出注释
变量使用前必须定义。没有定义的变量禁止使用
变量的使用尽量缩小到小的作用域
对象命名规范
text输入框：txt button按钮：btn select下拉选择框：sel option项：opt
form表单：frm frame框架：fra hidden表单项：hdn div标记：div
span标记：span 对话框对象：dlg 窗口对象：win
函数命名必须使用动词＋名词对的方式，并且能够体现函数的功能
函数命名的动词前缀必须是同函数功能相关的完整动词
函数命名第一个单词的首字母小写，后面每一个单词的首字母大写
八 18
互联网, 娱乐 植物大战僵尸, 游戏, 腾讯, 葫芦娃 2 Comments
以“抄袭”著称的腾讯公司近日再度为网友奉献了一款“抄袭”之作，一款模仿《植物大战僵尸》的web游戏《葫芦娃大战群妖》被正式推出。由知名游戏制作公司PopCap Games于2009年推出的益智策略类塔防御战游戏《植物大战僵尸》早已火爆全球。以iPhone版和iPad为例，该款游戏长期高居前三位。腾讯称其为首款3D网游大作《寻仙》，官方描述为：以为人熟知的中国传统神话为题材，独创的战斗体系、动作感很强的法宝大战、首创的多人骑宠、结婚、师徒等多样交互关系和丰富的副本活动让你体验不一样的仙侣生活。
下面让我们来看看腾讯公司推出的这款山寨版游戏截图，僵尸迷们看完后恐怕将彻底“内牛满面”。
正版《植物大战僵尸》截图
山寨版截图
2010年7月，《计算机世界》刊登了一篇题为《“狗日的”腾讯》封面头条文章，文中把腾讯作为互联网公敌进行批判，将互联网商业竞争写成了不 可调和的恩怨。详细叙述了联众、奇虎360等与腾讯之间的恩怨情仇。该文言辞辛辣、“刀刀见血”，并伴有联众创始人鲍岳桥等“受害者”声泪俱下的哭诉。 《计算机世界》更采用了一只身中多刀的腾讯企鹅作为其封面，称“山寨”的腾讯一直在模仿。
近期评论