司徒正美 - 博客园

纯CSS相册

摘要：最近都在研究javascript，CSS有点生疏了。是时候拿个东西练练手。<dl> <dt> <a href="#index6">6</a><a href="#index5">5</a><a href="#index4">4</a><a href="#index3">3</a>... 阅读全文

posted @ 2009-09-18 10:01 司徒正美阅读(8715) 评论(25) 推荐(8)

摘要： W3C那帮人的脑袋被驴踢了，直到javascript1.8.1才支持trim函数（与trimLeft，trimRight），可惜现在只有firefox3.5支持。由于去除字符串两边的空白实在太常用，各大类库都有它的影子。加之，外国人都很有研究精神，搞鼓了相当多实现。实现1 String.prototype.trim = function() { return this.replace(/^\s\... 阅读全文

posted @ 2009-09-18 00:15 司徒正美阅读(55652) 评论(45) 推荐(17)

javascript的缓动效果（第2部分）

摘要：这部分对原先的缓动函数进行抽象化，并结合缓动公式进行强化。成品的效果非常惊人逆天。走过路过不要错过。好了，打诨到此为止。普通的加速减速是难以让人满意的，为了实现弹簧等让人眼花缭乱的效果必须动用缓动公式。我见过两套缓动公式，一套是早期Robert Penner大神的缓动公式，内置到tween类中，不过现在人们越来越推荐tweenlite这个新秀了。另一套是script.aculo.us与mootoo... 阅读全文

posted @ 2009-09-17 04:18 司徒正美阅读(12530) 评论(34) 推荐(22)

数组取最大值与最小值

摘要：原型是个好东西，通常除了Object的原型不应该扩展，向原型添加新方法是很好的选择。我们看一下如何为数组取最大值与最小值。最笨的方法估计是这样： Array.prototype.max = function() { var max = this[0]; var len = this.length; for (var i = 1; i < len; i++){ if (this[i] m... 阅读全文

posted @ 2009-09-16 22:32 司徒正美阅读(6985) 评论(8) 推荐(3)

javascript的缓动效果（第1部分）

摘要：缓动，学名为Tween，缓冲移动的简称。要想页面内容切换起来舒服，就使用淡入淡出特效，要想让页面元素动起来自然，就要使用缓动效果。这两个混合起来，可以衍生多种特效的。感谢Flash开发人员为我们做了那么多先行研究，我们直接把它们拆出来装在各种菜单与相册中。我们先从最简单的东西做起，加速与减速。既然是缓动，它就一定涉及以下概念：距离，时间与速度。我们可以想象存在一条直线L，点A与点B就是L的起点与终... 阅读全文

posted @ 2009-09-16 09:20 司徒正美阅读(8884) 评论(16) 推荐(10)

判断是否为数组

摘要：判断一个对象是否为数组比较麻烦，以下是我收集的各种版本Douglas Crockford的版本 var isArray = function(a){ return a && typeof a === 'object' && typeof a.length === 'number' && typeof a.splice === 'function' && !(a.propertyIsEnumerab... 阅读全文

posted @ 2009-09-15 22:50 司徒正美阅读(1942) 评论(7) 推荐(2)

一个很简单的淡入淡出相册

摘要：不知题目是否妥当，总之就是在相册中使用fade效果，让图片切换变得非常自然舒服。<div id="album"> <img src="http://images.cnblogs.com/cnblogs_com/rubylouvre/202906/t_type1.jpg" /> <img src="http://images.cnblogs.com/cnblogs_... 阅读全文

posted @ 2009-09-14 21:58 司徒正美阅读(6589) 评论(32) 推荐(15)

javascript的可控式透明特效

摘要：透明特效是script.aculo.us提到的特效中最简单的特效之一。既然是特效，必须涉及时间与空间的概念。时间我们可以用setTimeout与setInterval，个人比较喜欢setTimeout，虽然它每次调用都重复注册，但可控性比较好。空间就全凭CSS的绝对定位实现位移了。在开始之前，我们练习一下setTimeout的递归用法（用来模拟setInterval）。 function tex... 阅读全文

posted @ 2009-09-14 18:19 司徒正美阅读(3596) 评论(10) 推荐(4)

javascript的拖放（第2部分）

摘要：实现手柄拖动的功能，就是把mousedown的事件侦听器放到handle中。由于我们原先程序的骨架搭建得比较好，添加新功能非常容易。# (handle || el).onmousedown = dragstart; <!doctype html><html dir="ltr" lang="zh-CN"> <head> <meta charset="utf... 阅读全文

posted @ 2009-09-11 18:49 司徒正美阅读(3188) 评论(20) 推荐(4)

Ruby's Louvre

导航

公告