js淡入淡出焦点图幻灯片效果代码分享


Posted in Javascript onSeptember 08, 2015

本文实例讲述了javascript淡入淡出焦点图幻灯片效果。分享给大家供大家参考。具体如下:
这是一款基于javascript实现的淡入淡出焦点图幻灯片效果代码,可以自定义标题,实现过程很简单。
运行效果图:-------------------查看效果 下载源码-------------------

js淡入淡出焦点图幻灯片效果代码分享

小提示:浏览器中如果不能正常运行,可以尝试切换浏览模式。
为大家分享的js淡入淡出焦点图幻灯片效果代码如下

<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>数字淡入淡出效果焦点图</title>
</head>
<body>
<style>
ul#bcty365_nav{padding-left:50px; margin-bottom:10px; border-bottom:2px solid #ccc; overflow:hidden; _zoom:1;}
ul#bcty365_nav li{float:left; display:inline; margin:10px;}
ul#bcty365_nav li a{display:block;color:#000000; font-size:16px;}
ul#bcty365_nav li a,#wimoban_p,#wimoban_p a{ font-family:"微软雅黑";}
ul#bcty365_nav li a:hover,#wimoban_p a:hover{color:red;}
</style> 
<div style="width:500px;height:300px;overflow:hidden;margin:30px auto;">
 <!-- 代码 开始 -->
 <script language='javascript'> 
 linkarr = new Array();
 picarr = new Array();
 textarr = new Array();
 var swf_width=500;
 var swf_height=300;
 //文字颜色|文字位置|文字背景颜色|文字背景透明度|按键文字颜色|按键默认颜色|按键当前颜色|自动播放时间|图片过渡效果|是否显示按钮|打开方式
 var configtg='0xffffff|0|0x3FA61F|5|0xffffff|0xC5DDBC|0x000033|2|3|1|_blank';
 var files = "";
 var links = "";
 var texts = "";
 //这里设置调用标记
 linkarr[1] = "https://3water.com";
 picarr[1] = "images/1.jpg";
 textarr[1] = "三水点靠木";
 linkarr[2] = "https://3water.com";
 picarr[2] = "images/2.jpg";
 textarr[2] = " 三水点靠木";
 linkarr[3] = "https://3water.com";
 picarr[3] = "images/3.jpg";
 textarr[3] = " 三水点靠木";
 linkarr[4] = "https://3water.com";
 picarr[4] = "images/4.jpg";
 textarr[4] = " 三水点靠木";
 
 
 for(i=1;i<picarr.length;i++){
 if(files=="") files = picarr[i];
 else files += "|"+picarr[i];
 }
 for(i=1;i<linkarr.length;i++){
 if(links=="") links = linkarr[i];
 else links += "|"+linkarr[i];
 }
 for(i=1;i<textarr.length;i++){
 if(texts=="") texts = textarr[i];
 else texts += "|"+textarr[i];
 }
 document.write('<object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,0,0" width="'+ swf_width +'" height="'+ swf_height +'">');
 document.write('<param name="movie" value="images/bcastr3.swf"><param name="quality" value="high">');
 document.write('<param name="menu" value="false"><param name=wmode value="opaque">');
 document.write('<param name="FlashVars" value="bcastr_file='+files+'&bcastr_link='+links+'&bcastr_title='+texts+'">');
 document.write('<embed src="images/bcastr3.swf" wmode="opaque" FlashVars="bcastr_file='+files+'&bcastr_link='+links+'&bcastr_title='+texts+'& menu="false" quality="high" width="'+ swf_width +'" height="'+ swf_height +'" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" />'); document.write('</object>'); 
 </script>
 <!-- 代码 结束 -->
 </div>
 <div style=" clear:both; width:700px; margin:0 auto; text-align:center; padding-top:10px;">
 <p></p>
</div>

</body>
</html>

以上就是为大家分享的js淡入淡出焦点图幻灯片效果代码,希望大家可以喜欢,并应用到实践中。

Javascript 相关文章推荐
用JQuery调用Session的实现代码
Oct 29 Javascript
基于jquery的监控数据是否发生改变
Apr 11 Javascript
seajs1.3.0源码解析之module依赖有序加载
Nov 07 Javascript
jQuery图片轮播的具体实现
Sep 11 Javascript
jQueryMobile之Helloworld与页面切换的方法
Feb 04 Javascript
介绍JavaScript的一个微型模版
Jun 24 Javascript
bootstrap中添加额外的图标实例代码
Feb 15 Javascript
js仿网易表单及时验证功能
Mar 07 Javascript
for循环 + setTimeout 结合一些示例(前端面试题)
Aug 30 Javascript
Vue组件化开发思考
Feb 02 Javascript
如何安装控制器JavaScript生成插件详解
Oct 21 Javascript
JavaScript设计模式之原型模式详情
Jun 21 Javascript
JavaScript实现的经典文件树菜单效果
Sep 08 #Javascript
cocos2dx骨骼动画Armature源码剖析(三)
Sep 08 #Javascript
JS实现的另类手风琴效果网页内容切换代码
Sep 08 #Javascript
cocos2dx骨骼动画Armature源码剖析(一)
Sep 08 #Javascript
js带点自动图片轮播幻灯片特效代码分享
Sep 07 #Javascript
jquery实现Slide Out Navigation滑出式菜单效果代码
Sep 07 #Javascript
js图片轮播特效代码分享
Sep 07 #Javascript
You might like
PHP分页函数代码(简单实用型)
2010/12/02 PHP
php json与xml序列化/反序列化
2013/10/28 PHP
Aster vs KG BO3 第一场2.18
2021/03/10 DOTA
javascript eval函数深入认识
2009/02/21 Javascript
js中的string.format函数代码
2020/08/11 Javascript
Js如何判断客户端是PC还是手持设备简单分析
2012/11/22 Javascript
javascript确认框的三种使用方法
2013/12/17 Javascript
JavaScript学习小结(7)之JS RegExp
2015/11/29 Javascript
Vue.js实战之利用vue-router实现跳转页面
2017/04/01 Javascript
JavaScript闭包和回调详解
2017/08/09 Javascript
Python中的random()方法的使用介绍
2015/05/15 Python
Python中return语句用法实例分析
2015/08/04 Python
python读取excel表格生成erlang数据
2017/08/26 Python
Python 关于反射和类的特殊成员方法
2017/09/14 Python
Python Django 实现简单注册功能过程详解
2019/07/29 Python
nginx黑名单和django限速,最简单的防恶意请求方法分享
2019/08/09 Python
浅谈Python3 numpy.ptp()最大值与最小值的差
2019/08/24 Python
解决Python对齐文本字符串问题
2019/08/28 Python
keras读取训练好的模型参数并把参数赋值给其它模型详解
2020/06/15 Python
python实现发送带附件的邮件代码分享
2020/09/22 Python
windows系统Tensorflow2.x简单安装记录(图文)
2021/01/18 Python
浅谈css3中calc在less编译时被计算的解决办法
2017/12/04 HTML / CSS
Html5监听手机摇一摇事件的实现
2019/11/07 HTML / CSS
Myprotein亚太地区:欧洲第一在线运动营养品牌
2020/12/20 全球购物
毕业生精彩的自我评价分享
2013/10/06 职场文书
残疾人创业典型事迹
2014/02/01 职场文书
《手指教学》反思
2014/02/14 职场文书
《蚂蚁和蝈蝈》教学反思
2014/02/24 职场文书
环境整治工作方案
2014/05/18 职场文书
学校节能减排方案
2014/06/13 职场文书
授权委托书格式范文
2014/08/02 职场文书
2014入党积极分子批评与自我批评思想汇报
2014/09/20 职场文书
单位个人查摆问题及整改措施
2014/10/28 职场文书
2015年班组工作总结
2015/04/20 职场文书
2019幼儿园感恩节活动策划书
2019/11/28 职场文书
Python基础之数据结构详解
2021/04/28 Python