by zhangxinxu from http://www.zhangxinxu.com
本文地址：http://www.zhangxinxu.com/wordpress/?p=90

实现的效果有点类似于Google picasa相册不同尺寸图片的切换效果。本实例通过文字大小（font-size）控制图片尺寸的做法是跟Google学习的，但是jQuery代码是根据效果自己想出来的，逻辑很简单，没有什么精妙之处。核心就是使用replace替换img src的图片路径，从而实现不同尺寸图片的切换。

下面这个动画就是显示了尺寸切换，单击“大图”按钮，则改变图片的src，加载大图，单击“小图”按钮，则又显示小图。

狠狠地点击：效果演示页面（含相关源代码打包下载）

replace用法简单讲解：

我其实也是新手，讲得不对望海涵。

字符串.replace(a,b);指的是用b将字符串含有a的部分代替，例如字符串：

obj="welcome to my website!";
obj.replace("my","zhangxinxu");

指的是用字符串zhangxinxu代替字符串obj中的"my"。

您有兴趣可以使用以下代码做测试：

var obj="welcome to my website!";
var newobj=obj.replace("my","zhangxinxu's");
alert(newobj);

好了，就说这么多，更多可以学习的内容在实例页面里。

本文为原创文章，转载请注明来自张鑫旭-鑫空间-鑫生活[http://www.zhangxinxu.com]
本文地址：http://www.zhangxinxu.com/wordpress/?p=90

（本篇完）