jquery实现显示和隐藏toggle()方法的使用

时间:2023-02-11 22:16:14
<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<title>demo1--简单动画实现</title>
<style>
#box1 { background:#98bf21;height:500px;width:500px;position:absolute;display:none;}
</style>
<script src="js/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
/*$(function(){
$("#box1").show(function(){
$(this).animate({width:'500px',height:'500px',opacity:'0.4'},1000);
$(this).animate({width:'0px',height:'0px',opacity:'0.4'},1000);
});
});*/
$(function(){
$("#box1").toggle(2000);
$("#box1").toggle(2000);
});
</script>
</head>
<body>
<div id="box1"></div>
</body>
</html>

jquery实现显示和隐藏toggle()方法的使用的更多相关文章

  1. jquery效果- 显示和隐藏 淡入淡出 滑动 隐藏

    jQuery 效果- 隐藏和显示:hide() 和 show() 规定隐藏/显示的速度,可以取以下值:"slow"."fast" 或毫秒 您可以使用 toggl ...

  2. jQuery中hover方法和toggle方法使用指南

    jQuery提供一些方法(如:toggle)将两种事件效果合并到一起,比如:mouseover.mouseout:keyup.keydown等 1.hover函数 hover(over,out)一个模 ...

  3. Jquery的显示与隐藏

    $(selector).hide(speed,callback); $(selector).show(speed,callback); 可选的 speed 参数规定隐藏/显示的速度,可以取以下值:&q ...

  4. jQuery的显示和隐藏

    在 jQuery 中可以使用 hide() 和 show() 方法来隐藏和显示 HTML 元素,以及使用 toggle() 方法能够切换 hide() 和 show() 方法. 隐藏例子: <! ...

  5. jQuery学习-显示与隐藏

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  6. jquery&period;datatables设置列隐藏的方法

    项目需要根据权限设置表格(使用Juqery.datatables,版本:1.10.16)某列显示或隐藏,百度后有两种实现方法: 1.在columns中设置: columns:[{data:" ...

  7. 控制input输入框中提示信息的显示和隐藏的方法

    在运用html+css+javascrpt进行页面制作时,我们往往会遇到一些影响用户体验,而又容易被我们忽视的小细节.比如,input输入框中的提示信息,怎样才能根据对象获得和失去焦点而实现其显示和隐 ...

  8. 7&period;jQuery之显示与隐藏效果

    这里用到三个函数方法:show()   hide()  toggle() 注意点是三个方法里面的两个参数的使用,前一个参数是时间,表示显示速度:后一个参数是回调函数,只有前面的动画执行完之后,回调函数 ...

  9. jquery统计显示或隐藏的元素个数

    统计显示的checkbox的数量: 统计隐藏的checkbox数量:

随机推荐

  1. 基于命令行编译打包phonegap for android应用 分类: Android Phonegap 2015-05-10 10&colon;33 73人阅读 评论&lpar;0&rpar; 收藏

    也许你习惯了使用Eclipse编译和打包Android应用.不过,对于使用html5+js开发的phonegap应用,本文建议你抛弃Eclipse,改为使用命令行模式,绝对的快速和方便. 一直以来,E ...

  2. Setting SVN Repository Using TortoiseSVN &plus; Dropbox in 5 Minutes

    SVN is a very common version control system in software development. However configuring SVN server ...

  3. ar1020 驱动移植 无效

    移植ar1020的spi驱动.驱动移植过来后,在原来的板子上都能够正常运行,而在新的板子却没有效果. 最后查看新旧板子的AR1020的电路,发现M2引脚连接不同.M2高电平连接的touch是5线的接口 ...

  4. delphi的几个特别关键字 object absolute

    1.object关键字相当于C++中的struct, record定义个结构体只能定义数据,而object可以定义方法,默认都是public的.   代码示例如下: TTest = record na ...

  5. java新手笔记21 接口

    1.接口 package com.yfs.javase; public interface IDemo1 {//interface 接口 public /*abstract*/ void method ...

  6. &period;NET Core &amp&semi; ASP&period;NET Core 1&period;0

    .NET Core & ASP.NET Core 1.0在Redhat峰会上正式发布 众所周知,Red Hat和微软正在努力使.NET Core成为Red Hat企业版Linux (RHEL) ...

  7. XmlHepler&lpar;拿去就能用&rpar;

    [系列目录](./XmlCatalog.html) 前言 本篇是这个系列的最后一篇.也是本人第一次写系列文章,虽然系列中大部分内容都是参考网络,但是自己都有敲代码验证.自己再编写过程中也学习到了很多知 ...

  8. lua 运算符

    lua 运算符 算术运算符 操作符 描述 + 加 - 减 * 乘 / 除 % 求模 ^ 求幂 示例程序 local a, b = 1, 2 print(a + b) print(a - b) prin ...

  9. Could not get lock &sol;var&sol;lib&sol;dpkg&sol;lock - open &lpar;11&colon; Resource temporarily unavailable&rpar; E&colon; Unable to lock the administration di

    alexander@alexander-virtual-machine:~$ sudo apt-get install -y httpdE: Could not get lock /var/lib/d ...

  10. 《SQLSERVER2012实施与管理实战指南》前4章节笔记内容

    <SQLSERVER2012实施与管理实战指南>前4章节笔记内容 <SQLSERVER2012实施与管理实战指南>的前面4章是<SQLSERVER企业级平台管理实践&gt ...