15jQuery学习笔记-----动画----层的显示和隐藏

show()、hide()方法会显示、隐藏元素。用toggle()方法在显示、隐藏之 间切换
$(":button[value=show]").click(function() { $("div").show(); }); $(":button[value=hide]").click(function() { $("div").hide();});
如果show、hide方法不带参数则是立即显示、立即隐藏,如果指定速度参数则会用指定时间进行动态显示、隐藏,
单位为毫秒,也可以使用三 个内置的速度:fast(200毫秒)、normal(400毫秒)、slow(600毫 秒),
jQuery动画函数中需要速度的地方一般也可以使用这个三个值。

 1 <head>
 2 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
 3     <title></title>
 4     <script src="jquery-1.8.3.js"></script>
 5     <script type="text/javascript">
 6         $(function () {
 7             //隐藏
 8             $(‘#btnHide‘).click(function () {
 9                 $(‘div‘).hide(500);
10             });
11             //显示
12             $(‘#btnShow‘).click(function () {
13                 $(‘div‘).show(800);
14             });
15             //显示和隐藏同一个按键
16             $(‘#btnToggle‘).click(function () {
17                 $(‘div‘).toggle(‘slow‘);
18             });
19
20
21         });
22     </script>
23 </head>
24 <body>
25     <input id="btnShow" type="button" name="name" value="显示层" />
26     <input id="btnHide" type="button" name="name" value="隐藏层" />
27     <input id="btnToggle" type="button" name="name" value="显示/隐藏层" />
28     <div style="height:200px;width:300px;background-color:blue">
29
30     </div>
31 </body>
32 </html>
时间: 2024-08-05 07:08:43

15jQuery学习笔记-----动画----层的显示和隐藏的相关文章

Android学习笔记(七)——显示对话框窗口

显示对话框窗口 1.创建Dialog1项目,在activity_main.xml文件中添加一个Button: <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:l

Sharepoint2013搜索学习笔记之自定义结果显示模板(九)

搜索结果通过套用定义好的显示模板来展示结果,显示模板由js和html组成,我们可以通过修改显示模板,然后将修改好的显示模板跟搜索结果绑定起来,来修改搜索结果的显示效果,例子如下图: 修改前 修改后 第一步,确定显示需要修改的显示模板,打开ie,摁f12,定位到搜索结果列表项找到需要修改的搜索项模板 第二步,从搜索中心进入网站设置页面 第三步,点击web设计器库的母版页和页面布局 第四步,进入母版页样式库的 Display Templates/search目录,该目录就是存放搜索结果显示模板的地方

C++学习笔记24,方法重写与方法隐藏

该博文仅用于交流学习,请慎用于任何商业用途,本博主保留对该博文的一切权利. 博主博客:http://blog.csdn.net/qq844352155 转载请注明出处: 方法重写.是指在子类中重新编写父类中的虚函数的实现.要求子类中的函数必须跟父类中的原型一致. 包括返回值类型(协变返回类型不算)以及参数的数目,排列顺序. #include <iostream> #include <string> using namespace std; class base{ public: v

控制div层的显示以及隐藏

控制div层的显示以及隐藏,例如,点击登录,弹出登录的层. 1.添加script代码 <script> function add_address(){ $('#popup2').show(); $('#gray').show(); } function closeAddressDiv(){ $('#popup2').hide(); } </script> 2.在body标签里面添加如下的div <div class="popup2" id="po

16jquery学习笔记-------动画----两种层显示和隐藏slide、fade

1 <html xmlns="http://www.w3.org/1999/xhtml"> 2 <head> 3 <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/> 4 <title></title> 5 <script src="jquery-1.8.3.js"><

17jquery学习笔记-------动画----图片在网页中移动,改变样式

animate:animate内部设置的多个值是同步变化的,链式的 animate是依次动画的.例子:animate({ left: 0, top: 0, width: 300, height: 300 },3000) .animate({ opacity: 0 }).animate({ opacity: 1 }).还可以指定增量,$(“#div1”).animate({ height: “+=100” });//如果 是+=.-=等增量形式要写成字符串,因为JavaScript不认识这种语法

计算机网络 学习笔记-传输层:TCP协议简介

概述: TCP传输前先要建立连接 TCP在传输层 点对点,一条TCP只能连接两个端点 可靠传输.无差错.不丢失.不重复.按顺序 全双工 字节流 TCP报文段 TCP报文段的报头前20字节是固定的,后面4n字节是根据需要而添加的. 20字节的固定部分: 源端口和目的端口:分别写入源端口号和目的端口号 序号:0-(2^32-1),本报文段数据的第一个字节的序号,用来解决乱序问题 确认序号:期望收到对方下一个报文段的第一个数据字节的序号,用来解决丢包问题 数据偏移:TCP报头长度,包括固定的20字节和

Android学习笔记--动画特效

直接上代码,有事先不多写,以后在补 MainActivity 1 package com.wuxianedu.animation; 2 3 import android.support.annotation.AnimRes; 4 import android.support.v7.app.AppCompatActivity; 5 import android.os.Bundle; 6 import android.view.View; 7 import android.view.animatio

OA学习笔记-007-Dao层设计

一. User, UserDao save(User user), update(), delete(), find(), ...Role, RoleDao save(Role role), update(), delete(), find(), ...Student, StudentDao save(Student student), update(), delete(), find(), ...... BaseDao<T> save(T t), update(), delete(), fi