本文以CSS3中的box-flex属性未切入口,简单介绍下CSS3中新的盒子模型——弹性盒子模型。介绍内容涵盖目前盒子模型所有的CSS属性,如box-orient, box-direction, box-align, box-pack, box-lines之类,其中每个属性都有代码展示与demo示例,并有丰富飞截图展示,可能有些地方啰嗦了点,但是内容还算比较具体,总之,希望能对您的学习有所帮助。
jQuery powerFloat万能浮动层下拉层插件
2010年12月16日 by 阅读 833699 次, 今日 111 次本文就是介绍自己最近一直在整的一款jQuery插件,名为powerFloat,中文名为万能浮动层插件。顾名思意就是可以实现基本上一切与某元素有位置关系的浮动效果。插件虽然强大,但是考虑到API的精炼,虽然制定了不少特殊的规则,所以此插件在学习成本上比一般的插件要高一点。这也是为何本文的内容会比较长的原因。其他就不多说了,虽然王有婆卖瓜的味道,但是我还是要说这个插件还是挺不错的。如果您对其中的规则都熟悉的话,会对您开发制作页面有很大的帮助的。主要是省掉了很多的功夫。
CSS3 box-shadow实现纸张的曲线投影效果
2010年12月12日 by 阅读 130494 次, 今日 4 次本文可以说是CSS3下的小点新技术展示吧。如何借助CSS3的一些属性实现类似纸张的曲线投影效果。内容不多,但是,有原理讲解,源码展示,有截图示意,还有demo实例页面。总之希望能对您的学习有所帮助。
CSS 相对|绝对(relative/absolute)定位系列(一)
2010年12月9日 by 阅读 333913 次, 今日 7 次本文是CSS 相对/绝对(relative/absolute)定位长篇系列的第一篇,大部分的内容被理论观点和题外话给占据了。本文主要内容就是分析了absolute与浮动之间的关系,一些典型的特性。还阐述了自己尽量不要使用absolute属性做普通DOM布局的观点。相对于本篇的文字量,图片啊代码啊以及demo相对少了写,但是,应该不会影响您的阅读与理解的。本文书写还是花了好些功夫的,力求准确表述自己观点的同时语言通俗生动。总之,希望本文能对您的学习有所帮助。
小tip:iframe高度动态自适应
2010年12月7日 by 阅读 185130 次, 今日 7 次我从来对iframe就没有什么好感,对其基本上是不屑一顾。但是人在江湖,身不由己。经理发话,新功能使用iframe实现,没办法,只好折腾,其中麻烦的是高度自适应的问题。后来,参考国外一些实现方法,根据原理提炼出了一个比较简单通用可行的方法。作为小小tip展示下,做备忘用。
本文内容不算多,但是该有的demo还是有的,该有的代码展示也是有的,有必要的截图。总之,希望能对您的学习提供帮助。
CSS3 Transitions, Transforms和Animation使用简介与应用展示
2010年11月25日 by 阅读 368170 次, 今日 22 次jQuery页面滚动图片等元素动态加载实现
2010年11月19日 by 阅读 539371 次, 今日 77 次常常会有这样子的页面,内容很丰富,页面很长,图片较多。比如说光棍节很疯狂的淘宝商城页面。或者是前段时间写血本买了个高档耳机的京东商城页面,或者是新浪微博之类。
这些页面图片数量多,而且比较大,少说百来K,多则上兆。要是页面载入就一次性加载完毕。乖乖,估计黄花都变成黄花菜了。所以,我们得做点什么,避免这种糟糕的状况发生。目前很流行的做法就是滚动动态加载,显示屏幕之外的图片默认是不加载的,随着页面的滚动,这个要显示图片的区域进入了浏览器可是窗口范围,则触发图片的加载显示。这种做法的好处是,一是页面加载速度快(浏览器转啊转的圈圈或是进度条很快就玩完了),二是节约了流量,因为不可能每个用户浏览页面时从头滚到尾的。
本文就是讲解如何通过jQuery实现这类滚动动态加载的实现。提供源代码下载,提供demo页面以及必要的截图展示。希望能对您的学习有所帮助。
备忘:CSS术语词汇表
2010年11月18日 by 阅读 49584 次, 今日 2 次最近整的MooTools库下Mbox弹框插件
2010年11月17日 by 阅读 84556 次, 今日 4 次不知道数年前,公司的前辈出于什么原因选择了MooTools库(貌似在国内不是很热),用Google趋势一搜这5个js库jQuery, mootools, YUI, dojo,extjs,结果如下图:
可怜的MooTools库垫底,但是,研究研究此库还是学到不少东西的,其OO思想,就如同JavaScript高级程序设计书中所展示的一样,基础不佳者往往很难驾驭,学习门槛高限制了其蓬勃发展啊,你看人家jQuery,即使JavaScript很初级的人也能整出点小花样,这种感觉就是——即使我很菜,我也能泡到美女,你说人家能不招人喜欢吗?
js页面滚动时层智能浮动定位实现(jQuery/MooTools)
2010年11月11日 by 阅读 170537 次, 今日 4 次关于层的智能浮动效果早在几年前我就在国外的一些个人网站的垂直导航上见到了,现在似乎在国内一些商业网站上也屡见此效果,例如淘宝网的搜索结果页的排序水平条,在默认状态下,滚动条跟随页面滚动,随着页面向下滚动,当此水平条接触浏览器的上边缘时,水平条独立出来,不跟随滚动条滚动了。类似的效果在新浪微博上也有,页面滚动,新动态提示开始要淡出浏览器窗口的时候,其浮动于浏览器窗口的最上沿显示,此效果实现原理其实很简单,本文就将展示其在jQuery和MooTools下的实现。提供代码以及demo效果展示,希望能对您的学习有所帮助。