jquery之超简单的div显示和隐藏特效demo

原创 2013年12月05日 14:19:45
1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

 2<html xmlns="http://www.w3.org/1999/xhtml">

 3<head>

 4<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 5<title>无标题文档</title>

 6<script src="jquery_last.js" type="text/javascript"></script>

 7<script type="text/javascript">

 8$(document).ready(  function(){});

 9function hiden(){

10$("#divObj").hide();//hide()函数,实现隐藏,括号里还可以带一个时间参数(毫秒)例如hide(2000)以2000毫秒的速度隐藏,还可以带slow,fast

11}

12function slideToggle(){

13$("#divObj").slideToggle(2000);//窗帘效果的切换,点一下收,点一下开,参数可以无,参数说明同上

14}

15function show(){

16$("#divObj").show();//显示,参数说明同上

17}

18function toggle(){

19$("#divObj").toggle(2000);//显示隐藏切换,参数可以无,参数说明同上

21}

22function slide(){

23$("#divObj").slideDown();//窗帘效果展开

24}

26</script>

27</head>

29<body>

30<h3>div里内容的显示隐藏特效</h3>

31<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()"/>

36<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>

48</body>

49</html>

50

js全页面刷新方法+jquery之超简单的div显示和隐藏特效demo

window.location.reload()刷新当前页面.  parent.location.reload()刷新父亲对象(用于框架)  opener.location.reload()刷新父窗口...
  • huangxinyu_it
  • huangxinyu_it
  • 2013年11月19日 15:39
  • 2345

Jquery显示隐藏特效

一、显示隐藏 1、hide(毫秒):元素在此毫秒内隐藏,两种情况:1、如果div设置了宽高背景色等 div内的字体会随着宽高色渐隐  2、如果没设置会按字体方式渐隐 2、hide(毫秒,functio...
  • u013126771
  • u013126771
  • 2015年05月19日 09:00
  • 357

jQuery点击按钮实现div的隐藏和显示切换效果

jQuery点击按钮实现div的隐藏和显示切换效果 点击按钮或者其他元素实现指定元素的显示和隐藏的切换在实际应用中非常常见,下面就以点击按钮实现div元素的隐藏和显示切换为例做一下简单介绍,...
  • u011637069
  • u011637069
  • 2016年04月10日 21:36
  • 6604

jquery显示、隐藏div

display:none和visible:hidden都能把网页上某个元素隐藏起来,但两者有区别: display:none ---不为被隐藏的对象保留其物理空间,即该对象在页面上彻底消失,通俗...
  • happyflyingave
  • happyflyingave
  • 2014年05月23日 17:50
  • 42963

jQuery显示隐藏div的几种方法

1、$("#demo").attr("style","display:none;");//隐藏div $("#demo").attr("style","display:block;");//显示div...
  • skh2015java
  • skh2015java
  • 2016年10月11日 17:37
  • 8299

教新手怎么使用jQuery实现简单的特效

1.先去下载 jquery-1.7.2.min.js,这个版本足以。建议不要使用2.0版本,对于低版本的IE浏览器...
  • bojie5744
  • bojie5744
  • 2014年07月11日 23:36
  • 854

JQuery操作div隐藏和显示的4种动画

不多说直接上代码,效果如下: Jquery-Div动画显示 ...
  • projectNo
  • projectNo
  • 2017年10月25日 18:12
  • 697

JQuery通过radio,select改变隐藏显示div

1)select下拉框控制div的隐藏与显示 function checkYear() { var selectValue = $("select[name='pe...
  • qq_36092584
  • qq_36092584
  • 2016年10月05日 21:18
  • 4883

jquery之超简单的div显示和隐藏特效demo

  1DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xht...
  • a506690
  • a506690
  • 2009年10月14日 14:32
  • 559

jquery之超简单的div显示和隐藏特效demo(转)

无标题文档 $(document).ready( function(){}); function hiden(){ $("#divObj").hide();//hide()函数,实现隐藏,括号里...
  • dxnn520
  • dxnn520
  • 2013年06月24日 12:24
  • 1861
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:jquery之超简单的div显示和隐藏特效demo
举报原因:
原因补充:

(最多只允许输入30个字)