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 相关文章推荐
Js中获取frames中的元素示例代码
Jul 30 Javascript
javascript中的window.location.search方法简介
Sep 02 Javascript
处理文本部分内容的TextRange对象应用实例
Jul 29 Javascript
JavaScript返回网页中锚点数目的方法
Apr 03 Javascript
通用javascript代码判断版本号是否在版本范围之间
Nov 29 Javascript
原生js实现tab选项卡切换
Mar 23 Javascript
微信小程序 input输入框控件详解及实例(多种示例)
Dec 14 Javascript
JavaScript 通过Ajax 动态加载CheckBox复选框
Aug 31 Javascript
详解vue几种主动刷新的方法总结
Feb 19 Javascript
部署vue+Springboot前后端分离项目的步骤实现
May 31 Javascript
详解element-ui动态限定的日期范围选择器代码片段
Jul 03 Javascript
如何在vue中使用HTML 5 拖放API
Jan 14 Vue.js
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
PHP初学者头疼问题总结
2006/07/08 PHP
使用NetBeans + Xdebug调试PHP程序的方法
2011/04/12 PHP
php 批量替换html标签的实例代码
2013/11/26 PHP
分享8个Laravel模型时间戳使用技巧小结
2020/02/12 PHP
出现“不能执行已释放的Script代码”错误的原因及解决办法
2007/08/29 Javascript
超级退弹代码
2008/07/07 Javascript
解决jquery .ajax 在IE下卡死问题的解决方法
2009/10/26 Javascript
JavaScript中SQL语句的应用实现
2010/05/04 Javascript
js打印纸函数代码(递归)
2010/06/18 Javascript
使用apply方法处理数组的三个技巧[译]
2012/09/20 Javascript
jQuery实现响应鼠标背景变化的动态菜单效果代码
2015/08/27 Javascript
JS+CSS实现自动切换的网页滑动门菜单效果代码
2015/09/14 Javascript
如何动态加载外部Javascript文件
2015/12/02 Javascript
jQuery插件Validation快速完成表单验证的方式
2016/07/28 Javascript
switch语句的妙用(必看篇)
2016/10/03 Javascript
vue制作加载更多功能的正确打开方式
2016/10/12 Javascript
10分钟掌握XML、JSON及其解析
2020/12/06 Javascript
jQuery Pagination分页插件使用方法详解
2017/02/28 Javascript
利用js查找数组中指定元素并返回该元素的所有索引示例
2017/03/29 Javascript
[04:56]经典回顾:前Ehome 与 前LGD
2015/02/26 DOTA
分析Python编程时利用wxPython来支持多线程的方法
2015/04/07 Python
Python排序搜索基本算法之希尔排序实例分析
2017/12/09 Python
Python工程师面试必备25条知识点
2018/01/17 Python
python 定时任务去检测服务器端口是否通的实例
2019/01/26 Python
django使用admin站点上传图片的实例
2019/07/28 Python
Python基础类继承重写实现原理解析
2020/04/03 Python
Python map及filter函数使用方法解析
2020/08/06 Python
pytorch __init__、forward与__call__的用法小结
2021/02/27 Python
小学教师办公室制度
2014/02/03 职场文书
大学生心理活动总结
2014/07/04 职场文书
人力资源管理求职信
2014/08/07 职场文书
2014年班组长工作总结
2014/11/20 职场文书
2014年教研室工作总结
2014/12/06 职场文书
学校运动会开幕词
2016/03/03 职场文书
小学作文指导之如何写人?
2019/07/08 职场文书
MongoDB日志切割的三种方式总结
2021/09/15 MongoDB