博文

目前显示的是标签为“实例”的博文

动了点小手脚,放大了头像

之前一直没怎么在意头像的问题,今天突然注意到头像并不是按照原图大小而显示的,更加无语的是,明显采用了浏览器自带的缩图的算法,导致图像非常的模糊,不过大概的估算了一下,发现右边栏就算是在1024的状态下也是可以容纳头像全图的,于是开始决定修改模版,把头像大小还原. 很容易的就找到了头像的模板代码部分: <a expr:href='data:userUrl'><img class='profile-img' expr:alt='data:photo.alt' expr:height='data:photo.height' expr:src='data:photo.url' expr:width='data:photo.width'/></a> 很明显了,其中 data:photo.height=图像高度 data:photo.width=图像宽度 修改为了指定的数值之后,我发现了一个问题.. 嗯,名字给顶到一边去了..orz 没办法,决定让它换行下来,结果无论我加多少BR也好,纹丝不动... 没辙了,虽然这台笔记本没有DOM查看器,我也只能装一个了...结果很快在Dom Inspector下看到,它显示名字采用的是一个P行,然后是固定显示的,IMG文件浮动在它上面,难怪怎么都无法让它换行... 于是照搬了下面的那个Class,把 <dt class='profile-textblock'><data:displayname/></dt> 中的profile-data改成了和下面显示签名一样的profile-textblock,于是,完美的下来了...如此简单. 预览了一下,效果还算凑合,起码比最初缩图看的感觉皱巴巴的强太多了... 另,补充一句,更新了小裤裤的Blog地址,之前把他的废宅子的地址给链接上了,这回终于链接上了新的豪宅,虽然在IE6下显示的布局很Shock,不过更加Shock的还是他的新宅的名字了....让我不由的想起了隆和肯....仰望...

XSL继续学习

继续总结一些XSL中比较实用的经验: 1.多用用属性比直接增加节点来的方便,也更加爱节约流量,但是属性中无法增加CDATA,所以必要的节点还是必要的 2.在XSL中所有的HTML必须要转义,特别用的多的有&要写成&amp,空格应当写成&#160; 3.输出XSL中的CDATA必须要用到JS才可以跨浏览器 <div id="test"><xsl:value-of disable-output-escaping="yes" select="//node"/></div> <xsl:if test="system-property('xsl:vendor')='Transformiix'"> <script language="JavaScript"> var el = document.getElementById("test"); el.innerHTML = el.lastChild.data; </script> </xsl:if> 其实很简单的一个东东,从上面的一个节点处取得这个节点的值,然后用innerHTML方法把它塞回元素里面,于是就能完整显示了,上面那个if test="system-property('xsl:vendor')='Transformiix'"其实是在测试浏览器是否是FF,因为IE直接就用disable-output-escaping="yes"这个属性让HTML直接输出了.

50个令人叹为观止的JavaScript应用站点

随着诸如 jQuery, Mootools, Prototype 一类的 JavaScript 框架的崛起,Web 开发者们基于这些框架创建了众多令人叹为观止的效果。以下的50个站点全部基于 JavaScript,却拥有 Flash 一样的绚丽效果。在很多 Web 开发者看来,Flash 并不是他们的首要选择,因为 Flash 至今对搜索引擎仍是不透明的,另外,Flash 的渲染需要浏览器插件,而 JavaScript 的一切都是本地的。 Tabs Aviary - http://aviary.com/ Aviary 使用了非常圆润的 Tab 效果,点击 Tab 后,渐出渐入的栏目介绍性内容非常漂亮,它的基于 JavaScript 的下拉菜单也美轮美奂。 Toolani - http://www.toolani.de/ 黄色内容区块下方的,基于 jQuery 的 Tabs 非常漂亮。 Podcasttuneup - http://www.podcast-tuneup.com/ 漂亮的 Tab 带着有趣的上卷与下卷效果。作为对比,该 Tab 框上方还有一个基于 Flash 的 Tab 框,可以看出,Flash 的反应速度明细要快得多,然而却要等半天的时间加载。 Adworks - http://www.adworks.ro/ 尽管这些 Tab 并不象前面提到的那几个,带渐入溅出效果,但那些大图标实在惹人喜欢。 We are Sofa - http://www.madebysofa.com/ 如果你想用文字式 Tab 这个网站是个很好的例子。 幻灯式内容 monofactor -http://www.monofactor.com/ 这个重新设计后的站点使用幻灯风格展示作者的作品。 Alex Buga - http://www.alexbuga.com/ Alex Buga 自诩为 Web 设计超级明星,使用了类似幻灯片的方式展示他最近的活动。位于右上角的那个主导航条也很 Cool,不过该站点大量使用了 Ajax。 Coda, one Window Web development - http://www.panic.com/coda/ 这个站可谓家喻户晓。是很多人获得灵感的地方。 Kobe - http://www.arcinspirations.com/kobe/ 漂...

网页设计高级布局40例参考

非常不错的一个CSS+DIV布局参考...基本上列举了所有的基础应用,由此也可以看到很多布局的特色和要点~ http://www.purecss.cn/article.asp?id=83 以上是中文版.这里是英文原版: http://blog.html.it/layoutgala/