<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript" src="js/jquery-1.5.1.js"></script>
<script type="text/javascript">
$(document).ready(function() {
});
function hiden() {
$("#divObj").hide();//hide()函数,实现隐藏,括号里还可以带一个时间参数(毫秒)例如hide(2000)以2000毫秒的速度隐藏,还可以带slow,fast
}
function slideToggle() {
$("#divObj").slideToggle(2000);//窗帘效果的切换,点一下收,点一下开,参数可以无,参数说明同上
}
function show() {
$("#divObj").show();//显示,参数说明同上
}
function toggle() {
$("#divObj").toggle(2000);//显示隐藏切换,参数可以无,参数说明同上
}
function slide() {
$("#divObj").slideDown();//窗帘效果展开
}
</script>
</head>
<body>
<h3>div里内容的显示隐藏特效</h3>
<input type="button" value="隐藏" onclick="hiden()" />
<input type="button" value="显示" onclick="show()" />
<input type="button" value="窗帘效果显示2" onclick="slide()" />
<input type="button" value="窗帘效果的切换" onclick="slideToggle()" />
<input type="button" value="隐藏显示效果切换" onclick="toggle()" />
<div id="divObj" style="display: none">
1.测试例子<br /> 2.测试例子<br /> 3.测试例子<br /> 4.测试例子<br /> 5.测试例子<br />
6.测试例子<br /> 7.测试例子<br /> 8.测试例子<br /> 9.测试例子<br /> 0.测试例子<br />
</div>
</body>
</html>
分享到:
相关推荐
本篇文章是对jquery中的div显示和隐藏特效demo进行了详细的分析介绍,需要的朋友可以参考下
jquery大量特效demo jquery大量特效demo jquery大量特效demo jquery大量特效demo jquery大量特效demo jquery大量特效demo jquery大量特效demo
jquery 添加删除 DIV 和 jquery 切换特效 jquery 添加删除 DIV 和 jquery 切换特效
jQuery显示隐藏DIV简单实例,需要隐藏网页的部分内容时经常会使用到展开、收起DIV,不是弹出的效果。
透明div可以拖动 Jquery特效,CSS+DIV透明div可以拖动 Jquery特效,CSS+DIV透明div可以拖动 Jquery特效,CSS+DIV
利用jquery框架实现层的显示与隐藏特效的一个简单的例子
jquery实现点击指定div外区域隐藏该div
jQuery css3鼠标悬停div容器显示光标动画特效 jQuery css3鼠标悬停div容器显示光标动画特效 jQuery css3鼠标悬停div容器显示光标动画特效
这是一款使用jQuery制作的可以使某个div固定的某个位置的页面布局特效插件。该div固定位置插件可以使侧边栏固定,也可以使顶部div缩小后固定在顶部或使某些按钮固定在页面上,非常实用。
reveal-it.js是一款jQuery文字淡入淡出显示特效插件。该文字特效插件可以使文字从左向右淡入淡出显示。该插件小巧简单,非常适合用于制作标题文字的动画效果。
前端+jQuery+实现烟花特效前端+jQuery+实现烟花特效前端+jQuery+实现烟花特效前端+jQuery+实现烟花特效前端+jQuery+实现烟花特效前端+jQuery+实现烟花特效前端+jQuery+实现烟花特效前端+jQuery+实现烟花特效前端+...
用jQuery制作的各类demo,包括表单验证、倒影轮播、离子效果、局部透镜、透明字母、日历、天气预报、透明字母、下雪特效、WIN8风格网站等等(包括最新的jQuery3.1版本),欢迎各位体验
使用JQUERY做的一个页面DIV动态隐藏 显示 点击+号图片后 DIV会自动隐藏 点击-号图片后 DIV会自动显示 隐藏的DIV区域内的控件值后台仍可以取得到,当页面刷新时,也不会改变隐藏区域的隐藏状态 使用JQUERY将页面状态...
jquery显示和隐藏div特效的实例代码,需要的朋友可以参考一下
jQuery制作右侧显示隐藏搜索框特效
图片标题默认隐藏不显示,鼠标移动到图片上后底部半透明的图片上显示图片标题,鼠标移走后标题消失,不错的图片特效,懒人之家推荐下载
jQuery超酷文字斜斜显示 jQuery超酷文字斜斜显示网页特效.zip
jquery实例 jquery demo jquery UI demo ,全部是例子 一看就会用