javascript 新闻幻灯片代码,带有动画效果

发布时间：2018-09-07 18:24:13 所属栏目：Asp教程来源：站长网

导读：今天给站长朋友们介绍一个javascript 幻灯片播放的代码，带有动画切换效果，以前在网上见到的都挺复杂感觉，所以自己动手写一个简单的，用时候只需更改图片路径就行了，其它的参数代码里也能改，本代码最大的亮点是简单高效。跟随烈火一起看一下效果，当

　　今天给站长朋友们介绍一个javascript 幻灯片播放的代码，带有动画切换效果，以前在网上见到的都挺复杂感觉，所以自己动手写一个简单的，用时候只需更改图片路径就行了，其它的参数代码里也能改，本代码最大的亮点是简单高效。

　　跟随烈火一起看一下效果，当然也可以先修改部分代码，再点击运行：

　　运行框：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=GBK" /> <title>简单高效的javascript 幻灯片播放 - Liehuo.net</title> </head> <body> <div> <div id="divs"> <img src="/uploads/common/images/liehuonet_400x345_1.jpg" id="1" style="FILTER: revealTrans(duration=2,transition=16); cursor:pointer;" onclick="location.href = 'http://tool.liehuo.net'"> <img src="/uploads/common/images/liehuonet_400x345_2.jpg" id="2" style="FILTER: revealTrans(duration=2,transition=17); cursor:pointer;display:none" onclick="location.href = 'http://bbs.liehuo.net'"> <img src="/uploads/common/images/liehuonet_400x345_3.jpg" id="3" style="FILTER: revealTrans(duration=2,transition=18); cursor:pointer;display:none" onclick="location.href = 'http://www.veryhuo.com'"> <img src="/uploads/common/images/liehuonet_400x345_4.jpg" id="4" style="FILTER: revealTrans(duration=2,transition=19); cursor:pointer;display:none" onclick="location.href = 'http://blog.liehuo.net'"> <img src="/uploads/common/images/liehuonet_400x345_5.jpg" id="5" style="FILTER: revealTrans(duration=2,transition=20); cursor:pointer;display:none" onclick="location.href = 'http://baike.liehuo.net'"> <img src="/uploads/common/images/liehuonet_400x345_6.jpg" id="6" style="FILTER: revealTrans(duration=2,transition=21); cursor:pointer;display:none" onclick="location.href = 'http://link.liehuo.net'"> </div> <script language="javascript"> function $(_sId) { return document.getElementById(_sId); } var speed=3000; var setid=null; var auto="true"; function galleryplay(divs,a,mtime){ //t为要应用此函数的id，a初始化时显示的项目的顺序数 if(divs=="0")return false; var start=3; if(auto=="true") { start = a-1;//初始项目 speed = mtime;//切换间隔 setid = null;//定时器 var loop = function(){ //自动切换 ids = divs.split(","); for (var i=0;i<ids.length; i++) { $(ids[i]).style.display='none'; } $(ids[start]).filters.revealTrans.Transition = Math.floor(Math.random() * 23); $(ids[start]).filters.revealTrans.apply(); $(ids[start]).filters.revealTrans.play(); $(ids[start]).style.display=''; setid=setTimeout(loop,speed); start++; if(start==ids.length){ start=0; } };loop(); } } galleryplay('1,2,3,4,5,6',1,3000); </script> </div> </body> </html><br /><center>如不能显示效果，请按Ctrl+F5刷新本页，更多网页代码：<a href='http://www.veryhuo.com/' target='_blank'>http://www.veryhuo.com/</a></center>
提示：可修改后代码再运行!

（编辑：常州站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!

ASP函数-2个日期格式转	ASP函数-SHA256保密函
ASP上传图片自动生成缩	ASP中运用OWC控件实现