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 相关文章推荐
基于JQuery制作的产品广告效果
Dec 08 Javascript
JavaScript制作的可折叠弹出式菜单示例
Apr 04 Javascript
使用jquery.validate自定义方法实现&quot;手机号码或者固话至少填写一个&quot;的逻辑验证
Sep 01 Javascript
Json解析的方法小结
Jun 22 Javascript
详解js中的apply与call的用法
Jul 30 Javascript
Vue.js递归组件构建树形菜单
Dec 24 Javascript
尝试自己动手用react来写一个分页组件(小结)
Feb 09 Javascript
angular 实现同步验证器跨字段验证的方法
Apr 11 Javascript
JavaScript静态作用域和动态作用域实例详解
Jun 17 Javascript
layui type2 通过url给iframe子页面传值的例子
Sep 06 Javascript
详解Vue template 如何支持多个根结点
Feb 10 Javascript
解决vuecli3中img src 的引入问题
Aug 04 Javascript
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
c#中的实现php中的preg_replace
2009/12/21 PHP
PHP序列化操作方法分析
2016/09/28 PHP
删除PHP数组中的重复元素的实现代码
2017/04/10 PHP
js onpropertychange输入框 事件获取属性
2009/03/26 Javascript
广告切换效果(缓动切换)
2009/05/27 Javascript
javascript 写类方式之五
2009/07/05 Javascript
基于jQuery替换table中的内容并显示进度条的代码
2011/08/02 Javascript
后台获取ZTREE选中节点的方法
2015/02/12 Javascript
JS实现的仿东京商城菜单、仿Win右键菜单及仿淘宝TAB特效合集
2015/09/28 Javascript
教你如何在Node.js中使用jQuery
2016/08/28 Javascript
jQuery实现的瀑布流加载效果示例
2016/09/13 Javascript
JS根据生日月份和日期计算星座的简单实现方法
2016/11/24 Javascript
jQuery实现web页面樱花坠落的特效
2017/06/01 jQuery
简单谈谈js的数据类型
2017/09/25 Javascript
Vue侧滑菜单组件——DrawerLayout
2017/12/18 Javascript
Node解决简单重复问题系列之Excel内容的获取
2018/01/02 Javascript
JavaScript实现滑块验证解锁
2021/01/07 Javascript
Python是编译运行的验证方法
2015/01/30 Python
用Python实现斐波那契(Fibonacci)函数
2016/03/25 Python
用Python将动态GIF图片倒放播放的方法
2016/11/02 Python
Python中字典的setdefault()方法教程
2017/02/07 Python
PyCharm在win10的64位系统安装实例
2017/11/26 Python
Python语言描述随机梯度下降法
2018/01/04 Python
详解python使用Nginx和uWSGI来运行Python应用
2018/01/09 Python
python爬虫基础教程:requests库(二)代码实例
2019/04/09 Python
Python实现计算对象的内存大小示例
2019/07/10 Python
python对一个数向上取整的实例方法
2020/06/18 Python
keras CNN卷积核可视化,热度图教程
2020/06/22 Python
Python用access判断文件是否被占用的实例方法
2020/12/17 Python
教师职业道德事迹材料
2014/08/18 职场文书
学雷锋志愿者活动方案
2014/08/21 职场文书
无房证明范本
2014/09/17 职场文书
高一学年自我鉴定范文(3篇)
2014/09/26 职场文书
开学第一周总结
2015/07/16 职场文书
Python Pygame实战在打砖块游戏的实现
2022/03/17 Python
《英雄联盟》2022日蚀、月蚀皮肤演示 黑潮亚索曝光
2022/04/13 其他游戏