三人行必有我师焉,择其善者而从之,其不善者而改之
三人行必有我师焉,择其善者而从之,其不善者而改之
三人行必有我师焉,择其善者而从之,其不善者而改之
三人行必有我师焉,择其善者而从之,其不善者而改之
三人行必有我师焉,择其善者而从之,其不善者而改之

  再向宝山行 作者:Neoxone    发表时间: 2010年12月17号,星期五     阅读:5,185 次  

杭州的老太太很有趣。

“小伙子,你走错路了,你应该往那边走,走这边是去市中心的,没什么景区的,
你往那边走过地下通道,到对面坐*7路车,就可以到灵隐啊,龙井啊,九溪十八涧啊,都在那边,
先到灵隐,然后到龙井,可以吃点藕粉,喝喝茶,看看雪景,那边景色也不错的。
小伙子,你平时喝茶不喝茶的啦,到杭州麽,也没什么特产好带,就是茶叶啊,丝绸啊,
丝绸麽,你们小年纪的不会感兴趣,会喝茶的话,可以顺便在那边买点茶叶回去,不过不要在路边的地摊上买,可以去茶农家里买,
市中心里也有茶叶卖的,不过要卖的贵个两三倍的。
龙井过去是九溪十八涧,那边过去可以看见一个瀑布,你走过瀑布,就是乾隆皇帝走过的路,叫做乾隆路。
到底以后麽,花5快钱叫上一辆三轮车,到六和塔,到塔上去25快钱,可以看看钱塘江。
六和塔玩过麽再可以坐*路车到雷峰塔,在底下玩玩,不要上去,可以省40快钱,
因为这个塔不是原来的塔,这是后来造的,原来的塔倒掉了,不过,到杭州的话不到雷锋塔是会遗憾的。
小伙子,你是哪里人啊,我说的话你听的懂吧。”

“听的懂,听的懂,我是从苏州过来的。”——这是我说的第一句话,没有表明我在杭州混过一年。

了解到我对那边景区应该不会很熟,老太太又复述了一遍路线,包括怎么从雷峰塔坐车到市中心。
“你往那边是到哪里啊?那边没什么景区。”

“哦,我想从那边上宝石山上去,看西湖。”

08年大学毕业后,第一次上宝石山,从那俯瞰西湖,我感觉这个世界就应该存在着一种天人合一的境界,而自己始终在这种境界之外。
俗事杂念,无时不刻不在内心折腾,想要获取名利,受人爱慕,万人敬仰固是一种积极的追求,
而抛弃杂念,修身养性,无为而为亦是一种人生的境界。
对于我,我的感觉就是,始终受缚在一个社会的牢笼内,而没有做过刻苦努力,没有经过千锤百炼,我的力量是如此微小,无论是摆脱,还是追求,是扯,是抓,是蹭,是跑,都无法挣脱束缚,进入境界。

呵呵,其实我连追求哪个境界都不知道,这是我的悲哀。
今日再上宝石山,看看我的心境还是不是始终停留在当年的那一刻。

人生苦短,去日苦多。最大的悲哀,某过于悲哀过去。





   

  opera下canvas的一个bug 作者:Neoxone    发表时间: 2010年12月11号,星期六     阅读:5,106 次  

测试的opera版本为10.63

对照其他浏览器,firefox,safari,chrome,ie9
发现:翻转之后,arc曲线方法在Opera下显得不可理解。
(绘制圆0-Math.PI*2是个例外,不会出现问题)

   

  浮动后block元素的水平居中,与横版布局的长度自适应 作者:Neoxone    发表时间: 2010年12月7号,星期二     阅读:7,980 次  

很久没有写布局方面的东西了。
今天介绍两个小技巧,与float,margin负值有关。

众所周知:
inline元素的水平居中可以用text-align:center;
block元素的水平居中可以用margin:0 auto; (设置宽度后,方显效果)。
block元素设置float:left;后,如果幸运,我们知道其确定的宽度值,则可以用left:50%;margin-left:-width/2;来实现。
那么,当我们不确定知道block具体要达到的宽度时,该如何办呢?
这种情况,常见于菜单栏居中,而因为某些原因,各个菜单项的宽度很难去确定,造成菜单栏宽度的不确定。
当然,我们也可以使用inline元素来嵌套菜单项(即使菜单项是block元素,也未尝不可),父级使用text-align:center;来居中。
而下面的方法也不错,值得吸收的小技巧。

下面介绍第二个简单的技巧。
它应用于横版布局的宽度自适应,因为我们同样不知道横版最终达到的宽度是多少。
尽管这种布局很少见,但里面的技巧其实用处很广。

里面的技巧其实就是个margin负值。
应用margin负值来完成预定的布局,往往有“柳暗花明”的效果。

/************** 额外奉送第三个小技巧 **************/
文本单行居中,多行居左的效果。

   

  姐姐的婚礼 作者:Neoxone    发表时间: 2010年11月19号,星期五     阅读:5,969 次  

2010.11.12日,姐姐踏入了婚姻的殿堂。
这些照片放在这里,一为祝福,二为自勉。





   

  CSS3的崛起——体验webkit的3D-Effect 作者:Neoxone    发表时间: 2010年11月16号,星期二     阅读:14,112 次  

在性能保证的前提下,向更高更炫的效果发起冲击是未来Web的一大需求,而CSS必将借此大展抱负,崛起于未来的web技术之林,独树一帜,无可撼动。而在这条道路上,Apple公司无疑是一位先驱:他们要将web交互推入3D时代。目前,不仅W3C通过了3d-transforms的工作草案,在webkit上3d-transforms也已经实现了。

本文意在体验,浅析3d-transforms,读者如对3d-transforms有技术方面的兴趣,可以阅读以下文档:
W3C的 css3-3d-transforms (工作草案)
Apple的 CSS Visual Effects Guide —— transforms (指南)
Apple的 Visual Effects Transform Functions (属性方法介绍)
westciv.com的 3Dtransforms (可视化演示)
webkit.org的 3D Transforms (有Demo讲解)

警告:以下所有Demo效果须使用safari5,开源的chrominm浏览器进行体验,而即使是在chrome12下的效果也会大打折扣。
下面这个demo来自marcofolio.net:3d animation using pure CSS3
以下是代码删减版

进一步删减

上面的Demo中,我们一直没有应用-webkit-transform-style: preserve-3d;这个属性。
事实上,上面的Demo仅仅是”伪3D”,只是我们面对的是屏幕这样一个2D平面,上面的Demo还无法区分出真3D和伪3D。

我们再看看下面这个真3D的Demo——来自webkit.org

hover状态下transform-style值是flat;未hover状态下是preserve-3d —— 两者的效果差异一目了然。
在上面的Demo中,不仅应用了transform属性,还使用了webkit css中另一个很牛的属性——animation
(而我们最前面的Demo也使用了webkit css中第三个很牛的属性——transition)

参照上面的Demo,我们对原demo也做个修改,