Jquery 滑入滑出效果实现代码


Posted in Javascript onMarch 27, 2010

CSS

<style type="text/css"> 
#divD{ 
width:300px; 
height:100px; 
background-color:#CC99FF; 
} 
</style>

Jquery代码
<script type="text/javascript" src="bg/js/jquery-1.4.2.min.js"></script> 
<script type="text/javascript"> 
$(document).ready(function(){ 
$("#btnFadein").bind("click",Fadein); //为btnFadein绑定click时间 
$("#btnFadeout").bind("click",Fadeout); //为btnFadeout绑定click时间 
}) function Fadein(){ 
$("#divD").slideDown("slow"); //滑入 
} 
function Fadeout(){ 
$("#divD").slideUp("slow"); //滑出 
} 
</script>

HTML
<body> 
<input type="button" value="滑入" id="btnFadein" /> 
<input type="button" value="滑出" id="btnFadeout"/> 
<div id="divD">这是div</div> 
DIV 
</body>

O(∩_∩)O每天进步一点点O(∩_∩)O 该BLOG供个人记录学习笔记,如有错误欢迎指出!
Javascript 相关文章推荐
Ext grid 添加右击菜单
Nov 26 Javascript
javascript 学习笔记(八)javascript对象
Apr 12 Javascript
Bootstrap媒体对象的实现
May 01 Javascript
JS控制div跳转到指定的位置的几种解决方案总结
Nov 05 Javascript
jquery 正整数数字校验正则表达式
Jan 10 Javascript
javascript 判断用户有没有操作页面
Oct 17 Javascript
Vuex的初探与实战小结
Nov 26 Javascript
Vue中Table组件Select的勾选和取消勾选事件详解
Mar 19 Javascript
基于JavaScript实现单例模式
Oct 30 Javascript
javascript中的with语句学习笔记及用法
Feb 17 Javascript
深入了解Vue3模板编译原理
Nov 19 Vue.js
JavaScript中MutationObServer监听DOM元素详情
Nov 27 Javascript
Jquery ajax不能解析json对象,报Invalid JSON错误的原因和解决方法
Mar 27 #Javascript
javascript sudoku 数独智力游戏生成代码
Mar 27 #Javascript
Javascript 函数中的参数使用分析
Mar 27 #Javascript
js几个验证函数代码
Mar 25 #Javascript
Firefox下提示illegal character并出现乱码的原因
Mar 25 #Javascript
JavaScript setTimeout和setInterval的使用方法 说明
Mar 25 #Javascript
JavaScript 学习初步 入门教程
Mar 25 #Javascript
You might like
基于PHP+MySQL的聊天室设计
2006/10/09 PHP
40个迹象表明你还是PHP菜鸟
2008/09/29 PHP
PHP使用array_multisort对多个数组或多维数组进行排序
2014/12/16 PHP
Smarty变量用法详解
2016/05/11 PHP
phpcms中的评论样式修改方法
2016/10/21 PHP
Yii2框架自定义验证规则操作示例
2019/02/08 PHP
解决windows上php xdebug 无法调试的问题
2020/02/19 PHP
Jquery实现无刷新DropDownList联动实现代码
2010/03/08 Javascript
来自国外的14个图片放大编辑的jQuery插件整理
2010/10/20 Javascript
jquery.Jwin.js 基于jquery的弹出层插件代码
2012/05/23 Javascript
基于JavaScript自定义构造函数的详解说明
2013/04/24 Javascript
javaScript array(数组)使用字符串作为数组下标的方法
2013/11/19 Javascript
jquery实现pager控件示例
2014/04/09 Javascript
jQuery中attr()方法用法实例
2015/01/05 Javascript
PHP 数组current和next用法分享
2015/03/05 Javascript
Jquery中request和request.form和request.querystring的区别
2015/11/26 Javascript
jQuery操作json常用方法示例
2017/01/04 Javascript
react native与webview通信的示例代码
2017/09/25 Javascript
jquery实现企业定位式导航效果
2018/01/01 jQuery
JS实现获取毫秒值及转换成年月日时分秒的方法
2018/08/15 Javascript
[02:31]《DAC最前线》之选手酒店现场花絮
2015/01/30 DOTA
Django验证码的生成与使用示例
2017/05/20 Python
python样条插值的实现代码
2018/12/17 Python
pyqt5 实现工具栏文字图片同时显示
2019/06/13 Python
Python利用pandas处理Excel数据的应用详解
2019/06/18 Python
Python 绘制酷炫的三维图步骤详解
2019/07/12 Python
Smallable意大利家庭概念店:设计师童装及家居装饰
2018/01/08 全球购物
main 函数执行以前,还会执行什么代码
2013/04/17 面试题
物理教育专业毕业生推荐信
2013/11/03 职场文书
《飞向蓝天的恐龙》教学反思
2014/04/09 职场文书
教师作风建设剖析材料
2014/10/11 职场文书
2014-2015学年工作总结
2014/11/27 职场文书
工作保证书
2015/01/17 职场文书
办公室日常管理制度
2015/08/04 职场文书
Redis入门教程详解
2021/08/30 Redis
Go语言怎么使用变长参数函数
2022/07/15 Golang