jQuery动画效果-slideUp slideDown上下滑动示例代码


Posted in Javascript onAugust 28, 2013
[code] 
<html> 
<head> 
<meta charset="utf-8"/> 
<style> 
*{ margin:0; padding:0;} 
body{font-size:15px;} 
#container{ margin:60px; line-height:2em; width:300px; border:1px solid #CCC;} 
.head{ background:#999; padding:5px; cursor:pointer;} 
.content{ text-indent:15px;} 
</style> 
<script type="text/javascript" src="script/jquery-1.4.2.min.js"></script> 
<script> 
$(function(){ 
$("h5.head").hover(function(){ 
$("div.content").slideUp(3000); 
},function(){ 
$("div.content").slideDown(3000); 
}); 
}) 
</script> 
</head> 
<body> 
<div id="container"> 
<h5 class="head">什么是jQuery?</h5> 
<div class="content"> 
JQuery是继prototype原型之后又一个javascript库,他凭借简单的代码和完善的浏览器兼容性,再加上强大的DOM操作,完善的事件处理机制,强大的ajax操作,加大的简化了javascript开发人员的工作。 
</div> 
</div> 
</body> 
</html>

[/code]
Javascript 相关文章推荐
代码精简的可以实现元素圆角的js函数
Jul 21 Javascript
ExtJS 2.0实用简明教程之应用ExtJS
Apr 29 Javascript
JavaScript实现Iterator模式实例分析
Jun 09 Javascript
jquery+css实现绚丽的横向二级下拉菜单-附源码下载
Aug 23 Javascript
微信JSSDK上传图片
Aug 23 Javascript
JavaScript使用DeviceOne开发实战(二) 生成调试安装包
Dec 01 Javascript
JS简单获取客户端IP地址的方法【调用搜狐接口】
Sep 05 Javascript
深入理解Node.js中通用基础设计模式
Sep 19 Javascript
jQuery EasyUI 选项卡面板tabs的使用实例讲解
Dec 25 jQuery
微信小程序控制台提示warning:Now you can provide attr &quot;wx:key&quot; for a &quot;wx:for&quot; to improve performance解决方法
Feb 21 Javascript
微信小程序获取当前位置和城市名
Nov 13 Javascript
jQuery实现简单聊天室
Feb 08 jQuery
jQuery动画效果-fadeIn fadeOut淡入浅出示例代码
Aug 28 #Javascript
Jquery 实现表格颜色交替变化鼠标移过颜色变化实例
Aug 28 #Javascript
Jquery仿淘宝京东多条件筛选可自行结合ajax加载示例
Aug 28 #Javascript
Jquery Uploadify多文件上传带进度条且传递自己的参数
Aug 28 #Javascript
ExtJS DOM元素操作经验分享
Aug 28 #Javascript
地址栏传递中文参数乱码在js里用escape转码
Aug 28 #Javascript
在JavaScript中实现类的方式探讨
Aug 28 #Javascript
You might like
全国FM电台频率大全 - 11 浙江省
2020/03/11 无线电
PHP脚本的10个技巧(7)
2006/10/09 PHP
常见php数据文件缓存类汇总
2014/12/05 PHP
PHP类的封装与继承详解
2015/09/29 PHP
php封装的图片(缩略图)处理类完整实例
2016/10/19 PHP
php递归函数怎么用才有效
2018/02/24 PHP
PHP防止sql注入小技巧之sql预处理原理与实现方法分析
2019/12/13 PHP
JS实现匀速运动的代码实例
2013/11/29 Javascript
javascript中with()方法的语法格式及使用
2014/08/04 Javascript
node.js中使用socket.io的方法
2014/12/15 Javascript
JavaScript实现网站访问次数统计代码
2015/08/12 Javascript
jQuery基于xml格式数据实现模糊查询及分页功能的方法
2016/12/25 Javascript
vue2.0 子组件改变props值,并向父组件传值的方法
2018/03/01 Javascript
详解SPA中前端路由基本原理与实现方式
2018/09/12 Javascript
基于Node.js的大文件分片上传示例
2019/06/19 Javascript
jQuery zTree插件快速实现目录树
2019/08/16 jQuery
vue.js循环radio的实例
2019/11/07 Javascript
JS实现可控制的进度条
2020/03/25 Javascript
[14:03]2017DOTA2亚洲邀请赛开幕式:12神兵演绎水墨中华
2017/04/01 DOTA
[03:42]2018完美盛典-《加冕》
2018/12/16 DOTA
[01:03:41]完美世界DOTA2联赛PWL S3 DLG vs Phoenix 第一场 12.17
2020/12/19 DOTA
python 控制语句
2011/11/03 Python
Python的爬虫包Beautiful Soup中用正则表达式来搜索
2016/01/20 Python
Python中Django 后台自定义表单控件
2017/03/28 Python
解决安装pycharm后不能执行python脚本的问题
2019/01/19 Python
python用win32gui遍历窗口并设置窗口位置的方法
2019/07/26 Python
关于Python 解决Python3.9 pandas.read_excel(‘xxx.xlsx‘)报错的问题
2020/11/28 Python
英国高街电视:High Street TV
2018/05/22 全球购物
Topshop美国官网:英国快速时尚品牌
2019/05/16 全球购物
银行求职推荐信范文
2013/11/30 职场文书
优秀经理获奖感言
2014/03/04 职场文书
企业文明单位申报材料
2014/05/16 职场文书
小学班主任培训方案
2014/06/04 职场文书
三方协议书
2015/01/27 职场文书
个人委托书范文
2015/01/28 职场文书
茶花女读书笔记
2015/06/29 职场文书