<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script src="js/jquery.min.js"></script>
<style type="text/css">
#divD{
width:300px;
height:100px;
background-color:#CC99FF;
position: absolute;

}
</style>
<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>
</head>
<body>
<input type="button" value="滑入" id="btnFadein" />
<input type="button" value="滑出" id="btnFadeout"/>
<div id="divD">这是div</div>
DIV
</body>
</html>

div层的滑入滑出实例的更多相关文章

  1. JQuery动画之滑入滑出动画

    1. 滑入动画(类似于商店的卷帘门) $(selector).slideDown(speed, 回调函数); 解释: 此语句实现的功能为, 在XX时间内, 下拉动画, 显现元素. 当 slideDow ...

  2. css transition 实现滑入滑出

    transition是css最简单的动画. 通常当一个div属性变化时,我们会立即看的变化,从旧样式到新样式是一瞬间的,嗖嗖嗖!!! 但是,如果我希望是慢慢的从一种状态,转变成另外一种状态,怎么办?  ...

  3. 【jquery隐藏、显示事件and提示callback】【淡入淡出fadeToggle】【滑入滑出slideToggle】【动画animate】【停止动画stop】

    1.jquery隐藏and显示事件 $("p").hide();      //隐藏事件$("p").hide(1000);  //1秒内缓慢隐藏$(" ...

  4. 在 jQuery 中使用滑入滑出动画效果，实现二级下拉导航菜单的显示与隐藏效果

    查看本章节 查看作业目录 需求说明: 在 jQuery 中使用滑入滑出动画效果,实现二级下拉导航菜单的显示与隐藏效果 用户将光标移动到"最新动态页"或"帮助查询" ...

  5. 伴随ListView、RecyclerView、ScrollView滚动滑入滑出小图标--第三方开源--FloatingActionButton

    FloatingActionButton在github上的项目主页是:https://github.com/makovkastar/FloatingActionButton 它的依赖包NineOldA ...

  6. WPF技术触屏上的应用系列（五）: 图片列表异步加载、手指进行缩小、放大、拖动 、惯性滑入滑出等效果

    原文:WPF技术触屏上的应用系列(五): 图片列表异步加载.手指进行缩小.放大.拖动 .惯性滑入滑出等效果 去年某客户单位要做个大屏触屏应用,要对档案资源进行展示之用.客户端是Window7操作系统, ...

  7. jQuary总结7:动画操作,显示与隐藏 淡入淡出, 滑入滑出

    1 jquery提供了三组基本动画,这些动画都是标准的.有规律的效果,jquery还提供了自定义动画的功能. 2 显示与隐藏: show([speed],[easing],[callback]) 显示 ...

  8. js窗口边缘滑入滑出效果-初级代码

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  9. ios 页面滑入滑出

    从左边滑进 CGRect r1,r2; r1 = app.testview.view.frame; r2 = self.view.frame; [app.testview.view setFrame: ...

随机推荐

  1. MySQL实战45讲学习笔记：第三十六讲

    一.引子 今天是大年三十,在开始我们今天的学习之前,我要先和你道一声春节快乐! 在上一篇文章中,我们在优化 join 查询的时候使用到了临时表.当时,我们是这么用的: create temporary ...

  2. centos7彻底卸载mysql和通过yum安装mysql

    彻底卸载mysql 查看是否有安装的mysql rpm -qa | grep -i mysql // 查看命令1 1 这里写图片描述 yum list install mysql* // 查看命令2 ...

  3. LeetCode 234：回文链表 Palindrome Linked List

    ​ 请判断一个链表是否为回文链表. Given a singly linked list, determine if it is a palindrome. 示例 1: 输入: 1->2 输出: ...

  4. A - QQpet exploratory park HDU - 1493 DP

      A - QQpet exploratory park HDU - 1493 Today, more and more people begin to raise a QQpet. You can ...

  5. virt-install命令---详解

    virt-install命令 一般选项:指定虚拟机的名称.内存大小.VCPU个数及特性等: -n NAME, --name=NAME:虚拟机名称,需全局惟一: -r MEMORY, --ram=MEM ...

  6. C 预处理器、头文件、文件读写

    预处理器 参考链接:https://www.runoob.com/cprogramming/c-preprocessors.html 预处理器是再变异之前做的一些工作 include 包含一个源文件代 ...

  7. 【转载】Visual Studio2017中如何设置解决方案中的某个项目为启动项目

    在C#的应用程序开发过程中,一个完成的解决方案可能包含多个子项目,有时候需要设置某一个子项目为启动项目,在Visual Studio 2017集成开发工具中,设置解决方案中的某个项目为启动项目的操作方 ...

  8. 在QT中使用FFmpeg库的部分报错问题

    win32: LIBS += -L$$PWD/../ffmpeg-win32-dev/lib/ -lavutil win32: LIBS += -L$$PWD/../ffmpeg-win32-dev/ ...

  9. python 检查站点是否可以访问

    最近碰到系统有时候会访问不了,想写一个程序来检测站点是不是可以访问的功能,正好在学python,于是写了一个方法来练练手,直接上代码. import urllib.request import smt ...

  10. Lodash 严重安全漏洞背后 你不得不知道的 JavaScript 知识

    摘要: 详解原型污染. 原文:Lodash 严重安全漏洞背后 你不得不知道的 JavaScript 知识 作者:Lucas HC Fundebug经授权转载,版权归原作者所有. 可能有信息敏感的同学已 ...