Archives for May, 2010

周日与几个朋友到杭州市民中心附近拍照, 活动之后到万象城旁的一个商场里吃饭, 在大堂看到儿童绘画展览, 喜出望外.

展览室里横行陈列着很多小学生的绘画作品, 在室内空旷的地方挂满了折叠飞机和小船. 画作都很抽象, 看不太懂, 但多少会勾起些童年回忆.

Read More...

JavaScript 是弱类型语言, 为了保证数值的有效性, 在处理数值的时候, 我们可以对数值字符串进行强行转换. 如 parseInt 取整和 parseFloat 取浮点数.

Java 也有 Integer.parseInt() 方法, 但是 JavaScript 的 parseInt 处理方式与 Java 等强整型语言不太一样, 所以经常有人因为对这个方法的使用不当而获得异常返回.

Read More...

JavaScript 有个 with 关键字, with 语句的原本用意是为逐级的对象访问提供命名空间式的速写方式. 也就是在指定的代码区域, 直接通过节点名称调用对象.

用过 Java 和 .NET 的同学对包或命名空间的概念应该不会陌生, 正因为有这个概念, 使代码的简洁易读得到了保证. 不知 JavaScript 设计之初是如何定位 with 语句的, 个人觉得它们之间有一定的相似度. 如:

Read More...

对JavaScript 放大镜来说, 计算倍率必不可少.
一个完整的放大镜结构里, 与倍率扯上关系的一共有 4 个对象, 原图, 缩略图, 镜片和视窗. 镜片在缩略图上的覆盖位置, 其实就是视窗对原图的部分展示, 所以它们之间有如下关系.
倍率 = 原图/缩略图 = 视窗/镜片

倍率一般大于等于 1, 因为原图一般都不会小于缩略图. 一旦倍率小于 1, 则将倍率设为 1.
因为缩略图和原图的尺寸是不可变的, 所以我们通过它们来获得倍率.

Read More...

JavaScript 放大镜是我成为前端后写的第一个组件, 从中学到了很多东西. 现在已经过去超过半年, 我希望能在自己仍有印象的时候, 整理和重新思考其中的一些处理方法, 将它改进, 并将这些想法写出来.

放大镜并不是一个难以实现的效果, 只是因为牵涉到一些精确的数值计算, 显得比较繁琐. 在未来的一段日子, 我会不定期地写关于 JavaScript 放大镜系列的文章, 每次讲一个点, 由点及面, 最后完成整个效果.

本次我们先了解如何在缩略图上移动镜片. (这是 DEMO)

Read More...

用 JS 计算鼠标在页面上的位置并非难事, 只要把握好各浏览器的区别就可以轻易算出鼠标位置. (这是 DEMO)

视窗 (浏览器可视窗口) 就像是页面上的掩板开了一个洞. 滚动条可以改变页面和视窗之间的偏移量, 从而可以通过视窗看到页面的各个位置.
鼠标在页面上的位置 = 页面和视窗之间的偏移量 + 鼠标在视窗中的位置

右图中的 cursorX 和 cursorY 分别是鼠标在视窗中的横向和纵向位置, scrollY 是页面和视窗之间的纵向距离. 当然, 当视窗宽度小于页面宽度的时候, 还会存在 scrollX. 那么鼠标在页面上的位置就是: (scrollX+cursorX, scrollY+cursorY)

IE 以外的浏览器 (本人测试过 Firefox 3.6, Opera 10.10, Chrome 4.1 和 Safari 4.0.4) 均可以通过 pageXOffset 和 pageYOffset 来获取页面和视窗间的横纵距离. 但 IE (本人测试过 IE6, IE7, IE8) 只能通过滚动位移来获取页面和视窗间的距离, 并存在一到两个像素的偏离.

Read More...

我发布过一款命名为 WP-RecentCommens 的插件. 顾名思义, 这插件主要用于显示最新评论, 因为其 AJAX 翻页, 查看详细的评论内容等特性, 获得了一些用户的肯定, 但一个看似不可调和的问题让插件显得有点尴尬 (最近收到几个关于该问题的来信).

关于这个问题, 我在很早之前应该就交代过. 如果用户从最新评论栏内点击进入文章内页, 如果刚好评论不在本页, 则无法通过锚点定位到该评论. 这个问题肯定会发生的, 但是几率很低.

Read More...