picChange 图片切换特效的函数代码


Posted in Javascript onMay 06, 2010

picChange 图片切换特效的函数代码

可扩展的封装方式,方便实现不同特效,源码中给出了淡出效果(fade函数),和移出效果(move函数)的实现方式。

一句话函数调用,实现图片切换特效。
picChange(“图片ul列表的id” , 切换图片的方法引用 , 图片切换时间 , 图片移动方向);
用最简单的调用方式和最简洁的html代码来实现这个常用的图片切换效果。
使用方法示例:

html代码:

<div id=”win”> 
<ul id=”picChange”> 
<li><img src=”img/1.jpg” alt=”" /></li> 
<li><img src=”img/1.jpg” alt=”" /></li> 
…… 
</ul> 
</div>

调用方式:
//直接切换效果 
picChange(“picChange”); 
//淡出效果 
picChange(“picChange”,fade,500); 
//向上移出效果 
picChange(“picChange”,move,500,”up”); 
//向下移出效果 
picChange(“picChange”,move,500,”down”); 
//向左移出效果 
picChange(“picChange”,move,500,”left”); 
//向右移出效果 
picChange(“picChange”,move,500,”right”);

看Demo猛击这里:http://demo.3water.com/js/picChange/index.html

打包下载地址

Javascript 相关文章推荐
jQuery EasyUI API 中文文档 - Tabs标签页/选项卡
Oct 01 Javascript
javascript中有趣的反柯里化深入分析
Dec 05 Javascript
JS 实现导航栏悬停效果(续)
Sep 24 Javascript
JS可以控制样式的名称写法一览
Jan 16 Javascript
JS取得绝对路径的实现代码
Jan 16 Javascript
js中函数声明与函数表达式
Jun 03 Javascript
js实现网页收藏功能
Dec 17 Javascript
JS判断元素是否在数组内的实现代码
Mar 30 Javascript
js获取html的span标签的值方法(超简单)
Jul 26 Javascript
js 上传文件预览的简单实例
Aug 16 Javascript
JavaScript比较同一天的时间大小实例代码
Feb 09 Javascript
原生JavaScript之es6中Class的用法分析
Feb 23 Javascript
JS 自定义函数缺省值的设置方法
May 05 #Javascript
JSQL 批量图片切换的实现代码
May 05 #Javascript
JSQL 基于客户端的成绩统计实现方法
May 05 #Javascript
JSQL SQLProxy 的 php 版本代码
May 05 #Javascript
JSQL  一个 web DB 的封装
May 05 #Javascript
Javascript JSQL,SQL无处不在,
May 05 #Javascript
Javascript 去除数组的重复元素
May 04 #Javascript
You might like
风格模板初级不完全修改教程
2006/10/09 PHP
发挥语言的威力--融合PHP与ASP
2006/10/09 PHP
用PHP实现的随机广告显示代码
2007/06/14 PHP
PHP json格式和js json格式 js跨域调用实现代码
2012/09/08 PHP
基于PHP创建Cookie数组的详解
2013/07/03 PHP
php导出csv数据在浏览器中输出提供下载或保存到文件的示例
2014/04/24 PHP
php中mt_rand()随机数函数用法
2014/11/24 PHP
老司机传授Ubuntu下Apache+PHP+MySQL环境搭建攻略
2016/03/20 PHP
js下用gb2312编码解码实现方法
2009/12/31 Javascript
js加强的经典分页实例
2013/03/15 Javascript
Javascript脚本实现静态网页加密实例代码
2013/11/05 Javascript
jQuery学习笔记之jQuery.extend(),jQuery.fn.extend()分析
2014/06/09 Javascript
JavaScript语言对Unicode字符集的支持详解
2014/12/30 Javascript
javascript实现链接单选效果的方法
2015/05/13 Javascript
SVG描边动画
2017/02/23 Javascript
HTML5实现微信拍摄上传照片功能
2017/04/21 Javascript
基于vue实现网站前台的权限管理(前后端分离实践)
2018/01/13 Javascript
vue实现引入本地json的方法分析
2018/07/12 Javascript
JavaScript函数式编程(Functional Programming)高阶函数(Higher order functions)用法分析
2019/05/22 Javascript
Python使用MySQLdb for Python操作数据库教程
2014/10/11 Python
PYTHON压平嵌套列表的简单实现
2016/06/08 Python
在自动化中用python实现键盘操作的方法详解
2019/07/19 Python
Django REST框架创建一个简单的Api实例讲解
2019/11/05 Python
PyCharm中如何直接使用Anaconda已安装的库
2020/05/28 Python
css3动画事件—webkitAnimationEnd与计时器time事件
2013/01/31 HTML / CSS
可以使用抽象函数重写基类中的虚函数吗
2013/06/02 面试题
领班岗位职责范文
2014/02/06 职场文书
财务人员求职自荐书范文
2014/02/10 职场文书
求职信模板
2014/05/23 职场文书
2014年优秀班主任工作总结
2014/12/16 职场文书
先进事迹材料怎么写
2014/12/30 职场文书
户外活动总结
2015/02/04 职场文书
工作态度恶劣检讨书
2015/05/06 职场文书
html实现随机点名器的示例代码
2021/04/02 Javascript
Redis延迟队列和分布式延迟队列的简答实现
2021/05/13 Redis
Mysql超详细讲解死锁问题的理解
2022/04/01 MySQL