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 相关文章推荐
JavaScript的变量作用域深入理解
Oct 25 Javascript
jQuery的实现原理的模拟代码 -4 重要的扩展函数 extend
Aug 03 Javascript
jquery使用淘宝接口跨域查询手机号码归属地实例
Nov 28 Javascript
js字符串转换成数字与数字转换成字符串的实现方法
Jan 08 Javascript
jQuery实现仿Alipay支付宝首页全屏焦点图切换特效
May 04 Javascript
基于jQuery滑动杆实现购买日期选择效果
Sep 15 Javascript
微信小程序实现带刻度尺滑块功能
Mar 29 Javascript
js使用generator函数同步执行ajax任务
Sep 05 Javascript
浅谈vue中使用图片懒加载vue-lazyload插件详细指南
Oct 23 Javascript
vue中的router-view组件的使用教程
Oct 23 Javascript
JavaScript格式化json和xml的方法示例
Jan 22 Javascript
vue 插件的方法代码详解
Jun 06 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
真正的ZIP文件操作类(php)
2007/07/21 PHP
PHP 登录记住密码实现思路
2013/05/07 PHP
php简单定时执行任务的实现方法
2015/02/23 PHP
PHP使用PDO操作数据库的乱码问题解决方法
2016/04/08 PHP
php实现文章置顶功能的方法
2016/10/20 PHP
php验证码生成器
2017/05/24 PHP
PHP实现的最大正向匹配算法示例
2017/12/19 PHP
关于PhpStorm设置点击编辑文件自动定位源文件的实现方式
2020/12/30 PHP
js left,right,mid函数
2008/06/10 Javascript
JavaScript Array对象扩展indexOf()方法
2014/05/09 Javascript
基本DOM节点操作
2017/01/17 Javascript
使用BootStrap实现标签切换原理解析
2017/03/14 Javascript
JavaScript运动框架 解决速度正负取整问题(一)
2017/05/17 Javascript
vue的事件绑定与方法详解
2017/08/16 Javascript
去掉vue 中的代码规范检测两种方法(Eslint验证)
2018/03/21 Javascript
记录微信小程序 height: calc(xx - xx);无效问题
2019/12/30 Javascript
JavaScript监听键盘事件代码实现
2020/06/03 Javascript
解决vue项目,npm run build后,报路径错的问题
2020/08/13 Javascript
Python对象体系深入分析
2014/10/28 Python
python查看FTP是否能连接成功的方法
2015/07/30 Python
Python 实现12306登录功能实例代码
2018/02/09 Python
Python中列表与元组的乘法操作示例
2018/02/10 Python
Django添加sitemap的方法示例
2018/08/06 Python
在pyqt5中QLineEdit里面的内容回车发送的实例
2019/06/21 Python
Pandas数据离散化原理及实例解析
2019/11/16 Python
使用PyTorch实现MNIST手写体识别代码
2020/01/18 Python
浅析关于Keras的安装(pycharm)和初步理解
2020/10/23 Python
一个基于canvas的移动端图片编辑器的实现
2020/10/28 HTML / CSS
全球知名提供各类营养保健品的零售商:Vitamin Shoppe
2016/10/09 全球购物
厂办主管岗位职责范本
2014/02/28 职场文书
在校大学生的职业生涯规划书
2014/03/14 职场文书
纪检干部对照检查材料
2014/08/22 职场文书
2016年党员创先争优公开承诺书
2016/03/25 职场文书
导游词之介休绵山
2019/12/31 职场文书
python基于tkinter制作无损音乐下载工具
2021/03/29 Python
php 防护xss,PHP的防御XSS注入的终极解决方案
2021/04/01 PHP