实现多张图片轮流展示效果.pdf

javascript 实现多张图片轮流展示效果 疯狂代码 http://CrazyC/ ĵ http:/CrazyC/Javascript/Article8349.html 看到很多网站WebSite上都有这样效果感觉很不错想据为己有但是扣起来实在是太麻烦于是自己写了个下面是 简单代码实现(只实现了基本功能样式和些细节还没修改来) 和以前样整合到了dojo中了现在用是1.0 基本原理很简单在个固定地方展示图片和标题这里用是指定展示图片用id以及展示标题容器id 还有就是根据图片长度动态创建系列手动切换按钮点击按钮就展示相应图片和标题目前仅实现了简单功能比在 ie7,firfox2,Safari下做了简单测试大体上就这个样子吧 下面是js /** *@fileoverview定义了. *@authorhf *@version1.0 */ (!dojo._hasResource[\com.hf.rollAd.RollerAd\]){//_hasResourcechecksaddedbybuild.Donotuse_hasRe sourcedirectlyinyourcode. dojo._hasResource[\com.hf.rollAd.RollerAd\]=true; vide(\com.hf.rollAd.RollerAd\); /** *图片轮流展示类 *@在个窗口中轮番展示些图片 *@constructor *@titles{Array}标题参数. *@picUrls{Array}图片参数. *@titleContainerId{String}存放标题容器id. *@picContainerId{String}存放图片容器id. *@manualControlContainerId{String}存放转换控制容器Id. *@chandeSecond{}图片翻转秒数. *@返回个com.hf.rollAd.RollerAd对象 */ com.hf.rollAd.RollerAd=function(/*Array*/titles,/*Array*/picUrls,/*links*/links, /*String*/titleContainerId,/*String*/picId, /*String*/manualControlContainerId, /**/chandeSecond){ /** *组标题 *@typeArray */ this.titles=titles; /** *组图片链接 *@typeArray [Page] */ this.picUrls=picUrls; this.links=links; /** *存放标题容器id *@typeString */ this.titleContainerId=titleContainerId; /** *存放图片容器id *@typeString */ this.picId=picId; /** *存放转换控制容器Id *@typeString */ this.manualControlContainerId=manualControlContainerId; /** *图片翻转秒数 *@type */ this.chandeSecond=chandeSecond; /*存放翻转图片按钮*/ this.buttonArray=; /*记录当前图片序号,*/ this.currentCount=0; }; com.hf.rollAd.RollerAtotype.init=function{ /*化手动图片切换钮生成*/ varmanualControlContainer=document.getElementById(this.manualControlContainerId); (manualControlContainer!=null){ for(vari=0;ithis.picUrls.length;i){