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 相关文章推荐
不用ajax实现点击文字即可编辑的方法
Dec 16 Javascript
javascript 写的一个简单的timer
Jul 30 Javascript
JQuery事件e参数的方法preventDefault()取消默认行为
Sep 26 Javascript
jQuery源码分析之jQuery中的循环技巧详解
Sep 06 Javascript
PHP使用方法重载实现动态创建属性的get和set方法
Nov 17 Javascript
jQuery实现指定内容滚动同时左侧或其它地方不滚动的方法
Aug 08 Javascript
JS取模、取商及取整运算方法示例
Oct 13 Javascript
JavaScript 判断对象中是否有某属性的常用方法
Jun 14 Javascript
vue代码分割的实现(codesplit)
Nov 13 Javascript
解决echarts的多个折现数据出现坐标和值对不上的问题
Dec 28 Javascript
Vue组件教程之Toast(Vue.extend 方式)详解
Jan 27 Javascript
JavaScript array常用方法代码实例详解
Sep 02 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模板中出现空行解决方法
2011/03/08 PHP
PHP内存缓存Memcached类实例
2014/12/08 PHP
JQuery 常用方法基础教程
2009/02/06 Javascript
客户端 使用XML DOM加载json数据的方法
2010/09/28 Javascript
JS判断当前日期是否大于某个日期的实现代码
2012/09/02 Javascript
查找页面中所有类为test的结点的方法
2014/03/28 Javascript
js中hash和ico的关联分析
2015/02/05 Javascript
Backbone中View之间传值的学习心得
2016/08/09 Javascript
AngularJS表单验证中级篇(3)
2016/09/28 Javascript
详解Node.js项目APM监控之New Relic
2017/05/12 Javascript
从vue基础开始创建一个简单的增删改查的实例代码(推荐)
2018/02/11 Javascript
在vscode中统一vue编码风格的方法
2018/02/22 Javascript
Angular2实现的秒表及改良版示例
2019/05/10 Javascript
微信小程序 云开发模糊查询实现解析
2019/09/02 Javascript
Layui实现数据表格中鼠标悬浮图片放大效果,离开时恢复原图的方法
2019/09/11 Javascript
[43:58]DOTA2上海特级锦标赛C组败者赛 Newbee VS Archon第二局
2016/02/27 DOTA
跟老齐学Python之有容乃大的list(2)
2014/09/15 Python
Python中不同进制的语法及转换方法分析
2016/07/27 Python
Python中强大的命令行库click入门教程
2016/12/26 Python
python实现神经网络感知器算法
2017/12/20 Python
python中set()函数简介及实例解析
2018/01/09 Python
python读取文本中数据并转化为DataFrame的实例
2018/04/10 Python
简单了解django缓存方式及配置
2019/07/19 Python
Django实现跨域请求过程详解
2019/07/25 Python
python Kmeans算法原理深入解析
2019/08/23 Python
pytorch查看通道数 维数 尺寸大小方式
2020/05/26 Python
关于tensorflow softmax函数用法解析
2020/06/30 Python
Python打印不合法的文件名
2020/07/31 Python
H&M美国官网:欧洲最大的服饰零售商
2016/09/07 全球购物
塔吉特百货公司官网:Target
2017/04/27 全球购物
工商治理实习生的自我评价
2014/01/15 职场文书
高中体育教学反思
2014/01/29 职场文书
文艺演出策划方案
2014/06/07 职场文书
导游词之麻姑仙境
2019/11/18 职场文书
Python实现Telnet自动连接检测密码的示例
2021/04/16 Python
一次MySQL启动导致的事故实战记录
2021/09/15 MySQL