文档介绍：项目5:使用JavaScriptJavaScript的速度和威力正呈几何数量增长。所有现代的浏览器,包括谷歌的Chrome,Mozilla的火狐,苹果的Safari和微软的IE,都能以接近机器码级的水平执行JavaScript脚本。加之,像W3C和WASP这样的标准化组织的推广,确保了JavaScript能一致地运行在各种浏览器上。Ajax库是演示JavaScript有效地运行于各浏览器的极好例子。在最后的项目中,你将学****扩展一个流行的Ajax库,jQuery,用它创建一个简单的Lightbox效果的产品照片库。使用jQuery有许多用来快速扩展网站的Ajax库。这个项目需要在站点件。你会看到在下载文件包里有两个Ajax库:jQuery和Spry。这两个库都是开源的。第一个库jQuery,可以说是最流行的Ajax库。你能从,从而得到详细的关于怎样使用这个库的信息。第二个库Spry,是由Adobe开发并管理的一个开源项目()。Adobe的Web开发工具,Dreamweaver,现已原生支持Spry。由于jQuery核心脚本允许被扩展,所以有成百的jQuery扩展被开发并被提供。使用JavaScript开发的jQuery扩展代码是难以保护的。因此,你会发现大多数jQuery扩展是作为开源项目被管理的。242项目5:。开发一个Lightbox式的图片管理工具Lightbox效果增强了屏幕操作。传统上,如果在网页上有个图片,你要么提供完整的图片,要么提供一个链到大图片的链接。Lightbox效果添加一个缩略图到页面()。当你选定缩略图时,主页面变暗并加载大图片()。导航按钮使你可以依次查看图库中的图片。关键在于,你永远不用离开你所在的页面。整个Lightbox的创建,需要用到图片组合,jQuery库,定制J的avaScript脚本,CSS和HTML。创建图片这个项目的第一步是创建所需的缩略图片和完全尺寸的图片()你可以使用所喜爱的编辑工具,如Photoshop,GIMP,或ExpressionDesign。来编辑原始图片文件,并创建72像素乘72像素的缩略图。。每个缩略图都能被选中。。243244项目5:。在你的网站中创建一个名为Photos的子文件夹。放你的缩略图和完全尺寸的大图到这个新建的文件夹。第二个文件夹,名为Images,包含所有用于依次移动图片的导航按钮的图片文件。使用JavaScript创建Lightbox功能的最复杂的部分是需要创建JavaScript库。在同一文件夹内创建一个名为JS的新文件夹,包含网站中的所有js文件。从网站新版的jQuery库,并把它放到JS文件夹。本项目的下载文件中已包含一个版本的jQuery。创建一个新的名为“”的JavaScript文件。并用你喜爱的文本编辑器打开这个“”文件。你需要添加如下的JavaScript脚本。并且你会看到一个$符号的使用。这是一个连接到jQuery对象的别名。(function($){$.=function(settings){项目5:使用JavaScript245第一组属性控制Lightbox如何在屏幕上显示。当你选择一个图片时,属性overlayBgColor设置背景色,并且属性overlay-Opacity定义了背景的透明程度。settings=({overlayBgColor:‘black’overlayOpacity:。fixedNavigation:falseimageLoading:‘images/lightbox-ico-’,imageBtnPrev:‘images/lightbox-btn-’imageBtnNext:‘images/lightbox-btn-’imageBtnClose:‘images/lightbox-btn-’,imageBlank:‘images/lightbox-’,属性containerBorderSize设置打开完全尺寸图片的容器周围的填充大小。containerBorderSize:10,以下设置以毫秒为单位,指定窗口打开和关闭的速度。