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 相关文章推荐
通过遮罩层实现浮层DIV登录的js代码
Feb 07 Javascript
原生js和jQuery写的网页选项卡特效对比
Apr 27 Javascript
理解Javascript图片预加载
Feb 23 Javascript
使用jquery获取url及url参数的简单实例
Jun 14 Javascript
JS实现多张图片预览同步上传功能
Jun 23 Javascript
使用jQuery实现动态添加小广告
Jul 11 jQuery
vue单页应用加百度统计代码(亲测有效)
Jan 31 Javascript
Bootstrap 按钮样式与使用代码详解
Dec 09 Javascript
浅谈vue异步数据影响页面渲染
Oct 29 Javascript
jQuery实现获取多选框的值示例
Feb 07 jQuery
vscode自定义vue模板的实现
Jan 27 Vue.js
JavaScript 获取滚动条位置并将页面滑动到锚点
Feb 08 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在不同页面间传递Json数据示例代码
2013/06/08 PHP
php输出echo、print、print_r、printf、sprintf、var_dump的区别比较
2013/06/21 PHP
JSON两种结构之对象和数组的理解
2016/07/19 PHP
PHP Include文件实例讲解
2019/02/15 PHP
不错的asp中显示新闻的功能
2006/10/13 Javascript
javascript 网页跳转的方法
2008/12/24 Javascript
javascript基础之查找元素的详细介绍(访问节点)
2013/07/05 Javascript
5个可以帮你理解JavaScript核心闭包和作用域的小例子
2014/10/08 Javascript
让编辑器支持word复制黏贴、截屏的js代码
2016/10/17 Javascript
根据输入邮箱号跳转到相应登录地址的解决方法
2016/12/13 Javascript
跨域请求两种方法 jsonp和cors的实现
2018/11/11 Javascript
vue数据初始化initState的实例详解
2019/04/11 Javascript
原生js实现随机点名功能
2019/11/05 Javascript
Element el-button 按钮组件的使用详解
2021/02/01 Javascript
[51:43]OG vs LGD 2018国际邀请赛淘汰赛BO3 第五场 8.26
2018/08/30 DOTA
python机器学习实战之K均值聚类
2017/12/20 Python
Python UnboundLocalError和NameError错误根源案例解析
2018/10/31 Python
pytorch permute维度转换方法
2018/12/14 Python
Python列表list排列组合操作示例
2018/12/18 Python
使用Python的Turtle库绘制森林的实例
2019/12/18 Python
tensorflow安装成功import tensorflow 出现问题
2020/04/16 Python
pytorch简介
2020/11/11 Python
HTML5中meta属性的使用方法
2016/02/29 HTML / CSS
Lenox官网:精美的瓷器&独特的礼品
2017/02/12 全球购物
Microsoft Advertising美国:微软搜索广告
2019/05/01 全球购物
物业管理应届生求职信
2013/10/28 职场文书
高中物理教学反思
2014/02/08 职场文书
大学生通用个人自我评价
2014/04/27 职场文书
大学理论知识学习自我鉴定
2014/04/28 职场文书
家具公司总经理岗位职责
2014/07/08 职场文书
镇党委书记群众路线整改措施思想汇报
2014/10/13 职场文书
八年级英语教学计划
2015/01/23 职场文书
培训通知
2015/04/17 职场文书
党员干部学法用法心得体会
2016/01/21 职场文书
python 下划线的多种应用场景总结
2021/05/12 Python
centos8安装MongoDB的详细过程
2021/10/24 MongoDB