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 相关文章推荐
IE6,IE7下js动态加载图片不显示错误
Jul 17 Javascript
jquery中防刷IP流量软件影响统计的一点对策
Jul 10 Javascript
web的各种前端打印方法之jquery打印插件jqprint实现网页打印
Jan 09 Javascript
select标签模拟/美化方法采用JS外挂式插件
Apr 01 Javascript
制作jquery遮罩层效果导航菜单代码分享
Dec 25 Javascript
原生javascript实现匀速运动动画效果
Feb 26 Javascript
jquery获取下拉框中的循环值
Feb 08 Javascript
canvas仿iwatch时钟效果
Mar 06 Javascript
微信小程序实现横向增长表格的方法
Jul 24 Javascript
EasyUI 数据表格datagrid列自适应内容宽度的实现
Jul 18 Javascript
layui上传图片到服务器的非项目目录下的方法
Sep 26 Javascript
js实现弹幕飞机效果
Aug 27 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 5.3.x 的strtotime() 时区设定 警告信息修复
2013/08/05 PHP
基于laravel制作APP接口(API)
2016/03/15 PHP
php中this关键字用法分析
2016/12/07 PHP
PHP 实现页面静态化的几种方法
2017/07/23 PHP
Javascript实例教程(19) 使用HoTMetal(2)
2006/12/23 Javascript
JavaScript 数组循环引起的思考
2010/01/01 Javascript
javascript实现按回车键切换焦点
2015/02/09 Javascript
javascript原始值和对象引用实例分析
2015/04/25 Javascript
ztree获取选中节点时不能进入可视区域出现BUG如何解决
2015/12/03 Javascript
基于JavaScript实现瀑布流效果(循环渐近)
2016/01/27 Javascript
VUE axios上传图片到七牛的实例代码
2017/07/28 Javascript
原生JS实现动态加载js文件并在加载成功后执行回调函数的方法
2020/12/30 Javascript
浅谈React Event实现原理
2018/09/20 Javascript
解决vue 界面在苹果手机上滑动点击事件等卡顿问题
2018/11/27 Javascript
Vuex的实战使用详解
2019/10/31 Javascript
[08:08]2014DOTA2国际邀请赛中国区预选赛精彩TOPPLAY
2014/06/25 DOTA
python爬虫入门教程之点点美女图片爬虫代码分享
2014/09/02 Python
Python字符串中查找子串小技巧
2015/04/10 Python
解析Python中的二进制位运算符
2015/05/13 Python
Python基本语法经典教程
2016/03/11 Python
浅谈flask截获所有访问及before/after_request修饰器
2018/01/18 Python
Python hashlib模块用法实例分析
2018/06/12 Python
解决python3读取Python2存储的pickle文件问题
2018/10/25 Python
python pytest进阶之conftest.py详解
2019/06/27 Python
Python内置数据类型list各方法的性能测试过程解析
2020/01/07 Python
python如何安装下载后的模块
2020/07/03 Python
快速创建python 虚拟环境
2020/11/28 Python
全网最细 Python 格式化输出用法讲解(推荐)
2021/01/18 Python
阿联酋手表和配饰购物网站:Rivolishop
2019/11/25 全球购物
工程造价管理专业大专生求职信
2013/10/06 职场文书
机关党员公开承诺书
2014/08/30 职场文书
2015年销售工作总结范文
2015/03/30 职场文书
淘宝客服专员岗位职责
2015/04/07 职场文书
施工现场安全管理制度
2015/08/05 职场文书
学校中层领导培训心得体会
2016/01/11 职场文书
Oracle锁表解决方法的详细记录
2022/06/05 Oracle