编程 Javascript

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供个人记录学习笔记，如有错误欢迎指出！

Jquery 滑入滑出效果实现代码

声明：登载此文出于传递更多信息之目的，并不意味着赞同其观点或证实其描述。

Javascript 相关文章推荐

Javascript load Page,load css,load js实现代码

Mar 31 Javascript

Jquery仿淘宝京东多条件筛选可自行结合ajax加载示例

Aug 28 Javascript

教你如何在 Javascript 文件里使用 .Net MVC Razor 语法

Jul 23 Javascript

js获取微信版本号的方法

May 12 Javascript

jquery实现华丽的可折角广告代码

Sep 02 Javascript

详解JS正则replace的使用方法

Mar 06 Javascript

js判断复选框是否选中及选中个数的实现代码

May 30 Javascript

js通过classname来获取元素的方法

Nov 24 Javascript

js鼠标移动时禁止选中文字

Feb 19 Javascript

vue给对象动态添加属性和值的实例

Sep 09 Javascript

微信小程序自定义组件components(代码详解)

Oct 21 Javascript

浅谈react路由传参的几种方式

Mar 23 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类

2008/04/09 PHP

PHP 图像尺寸调整代码

2010/05/26 PHP

图文介绍PHP添加Redis模块及连接

2015/07/28 PHP

php计划任务之验证是否有多个进程调用同一个job的方法

2015/12/07 PHP

ThinkPHP的SAE开发相关注意事项详解

2016/10/09 PHP

PHP + plupload.js实现多图上传并显示进度条加删除实例代码

2017/03/06 PHP

js checkbox(复选框) 使用集锦

2009/04/28 Javascript

jquery last-child 列表最后一项的样式

2010/01/22 Javascript

js获取指定的cookie的具体实现

2014/02/20 Javascript

js由下向上不断上升冒气泡效果实例

2015/05/07 Javascript

JS+CSS实现的经典tab选项卡效果代码

2015/09/16 Javascript

表单元素值获取方式js及java方式的简单实例

2016/10/15 Javascript

微信小程序页面跳转和数据传递实例详解

2017/01/19 Javascript

Angular2进阶之如何避免Dom误区

2018/04/02 Javascript

详解无限滚动插件vue-infinite-scroll源码解析

2019/05/12 Javascript

JS实现移动端在线签协议功能

2019/08/22 Javascript

js中比较两个对象是否相同的方法示例

2019/09/02 Javascript

JavaScript实现下拉列表

2021/01/20 Javascript

[01:39]（回顾）各路豪强针锋相对，几经鏖战四强产生

2014/07/01 DOTA

python中类的一些方法分析

2014/09/25 Python

Python利用ansible分发处理任务

2015/08/04 Python

Python用模块pytz来转换时区

2016/08/19 Python

Python推导式简单示例【列表推导式、字典推导式与集合推导式】

2018/12/04 Python

python绘制散点图并标记序号的方法

2018/12/11 Python

Python中最大递归深度值的探讨

2019/03/05 Python

python常用库之NumPy和sklearn入门

2019/07/11 Python

Django 拼接两个queryset 或是两个不可以相加的对象实例

2020/03/28 Python

Python RabbitMQ实现简单的进程间通信示例

2020/07/02 Python

Pandas DataFrame求差集的示例代码

2020/12/13 Python

HTML5安全介绍之内容安全策略（CSP）简介

2012/07/10 HTML / CSS

Lacoste(法国鳄鱼)加拿大官网：以标志性的POLO衫而闻名

2019/05/15 全球购物

加拿大领先的时尚和体育零售商：Sporting Life

2019/12/15 全球购物

职业生涯规划怎么写

2013/12/29 职场文书

加工操作管理制度

2014/01/19 职场文书

廉洁自律证明

2015/06/24 职场文书

基于Redis的List实现特价商品列表功能

2021/08/30 Redis