<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<head>

<!--引入百度库-->

<script src="http://libs.baidu.com/jquery/1.10.2/jquery.min.js">

</script>

<title></title>

<script>

$(document).ready(function(){

$("button").click(function(){

/* $("#mm").fadeToggle();

$("#cc").fadeToggle();   */

$("#mm").slideToggle("slow")  // id #  滑动淡入淡出

$("#cc").slideToggle("fast");

});

});

</script>

</head>

<body>

<button style=" height: 30px; width: 100px;">Start Animation</button>

<div  id="mm" style="background:#98bf21;height:100px;width:100px;">

</div>

<div id="cc" style="background-color: burlywood; height: 100px; width:100px;"> </div>

</body>

</html>

jquery 滑动动画的更多相关文章

  1. jQuery实用小技巧-获取选中的的下拉框和返回头部滑动动画

    //获取选中的下拉框 $('#someElement').find('option:selected'); $('#someElement option:selected'); //返回头部滑动动画 ...

  2. 利用jquery实现百度新闻导航菜单滑动动画

    前言 前两天,群里有人问百度新闻导航是如何实现的,当时由于忙于工作,没有来得及细看,恰好今天有空闲时间,索性就实现一下这个效果吧: 思路与步骤 1.利用UL创建简单横向导航: <!DOCTYPE ...

  3. jQuery 代码的层定位滑动动画效果

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  4. 【Web】利用jquery实现百度新闻导航菜单滑动动画

    前言 前两天,群里有人问百度新闻导航是如何实现的,当时由于忙于工作,没有来得及细看,恰好今天有空闲时间,索性就实现一下这个效果吧: 思路与步骤 1.利用UL创建简单横向导航: <!DOCTYPE ...

  5. FlexSlider jQuery滑动切换插件 参数

    demo:http://www.sucaihuo.com/jquery/0/6/demo/ FlexSlider是一个非常出色的jQuery滑动切换插件,它支持所有主流浏览器,并有淡入淡出效果.适合所 ...

  6. jQuery 停止动画、jQuery Callback 函数、jQuery - Chaining

    一.jQuery 停止动画 jQuery stop() 方法用于在动画或效果完成前对它们进行停止. stop() 方法适用于所有 jQuery 效果函数,包括滑动.淡入淡出和自定义动画. $(sele ...

  7. jQuery的动画效果

    jQuery 是一个 JavaScript 库.jQuery 库可以通过一行简单的标记被添加到网页中. <script type="text/javascript" src= ...

  8. jQuery 停止动画

    jQuery stop() 方法用于在动画或效果完成前对它们进行停止. 停止滑动 点击这里,向上/向下滑动面板 实例 jQuery stop() 滑动演示 jQuery stop() 方法. jQue ...

  9. FlexSlider是一个非常出色的jQuery滑动切换插件

    FlexSlider是一个非常出色的jQuery滑动切换插件,它支持所有主流浏览器,并有淡入淡出效果.适合所有初级和高级网页设计师使用.不过很多人都只是使用默认的参数,今天来说说具体的参数来给大家看看 ...

随机推荐

  1. 李炎恢bootstarp_项目实战__瓢城企业(注释+源码)

    源代码下载地址:http://pan.baidu.com/s/1gfI9Pj9 /********************************* pc界面设备页面***************** ...

  2. Cocos2d 3.0继承自Sprite的类在addChild后出现故障

    当继承自Sprite的类被addChild到其它的Node里后出现例如以下图问题,说明没有调用父类Sprite::init()的方法.由于父类Sprite里的_textureAtlas须要初始化为nu ...

  3. Qt编写串口通信程序全程图文解说

    (说明:我们的编程环境是windows xp下,在Qt Creator中进行,假设在Linux下或直接用源代码编写,程序稍有不同,请自己修改.) 在Qt中并没有特定的串口控制类,如今大部分人使用的是第 ...

  4. android 判断应用程序是否已安装

    1.判断是否安装/** check the app is installed*/private boolean isAppInstalled(Context context,String packag ...

  5. Android 中 更新视图的函数ondraw() 和dispatchdraw（）的区别

    绘制VIew本身的内容,通过调用View.onDraw(canvas)函数实现 绘制自己的孩子通过dispatchDraw(canvas)实现 View组件的绘制会调用draw(Canvas canv ...

  6. XC一键锁屏应用

    XC一键锁屏,一键Android锁屏应用,彻底解放开关机键~ 下载地址: http://download.csdn.net/detail/jczmdeveloper/7329447

  7. 【jQuery】用jQuery给文本框添加只读属性【readOnly】

    <input id="id" type="text" /> jQuery( $("#ID").attr({ readonly: ...

  8. [上传下载] C# UpLoadFiles文件上传类 （转载）

    点击下载 UpLoadFiles.zip 主要功能如下 /// <summary> /// 上传文件 /// </summary> /// <param name=&qu ...

  9. IPX/SPX

    转自百度百科 方便阅读 IPX/SPX   目 录 1英文原义 2中文释义 3IPX协议 3.1 说明 3.2 应用 4SPX协议 4.1 说明 4.2 应用     1英文原义 IPX/SPX 2中 ...

  10. 源码心德`Context`类

    Context,中文直译为“上下文”,SDK中对其说明如下: Interface to global information about an application environment. Thi ...