jquery-show()-显示和隐藏

原创 2012年03月27日 19:10:48
<!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 src="../jquery/jquery-1.7.1.js"></script>
<script>
$(document).ready(function (){
//利用toggle方法实现显示和隐藏
$('#btn0').toggle(function (){
		//先隐藏掉
		$('p').hide('slow');
		},function(){
	//再显示出来
		$('p').show('slow');
			
	});
	
//利用toggle方法实现淡入淡出
$('#btn1').toggle(function (){
		//先隐藏掉
		$('p').fadeIn('slow');
		},function(){
	//再显示出来
		$('p').fadeOut('slow');
			
	});
$('#btn1').toggle(function (){
		//先隐藏掉
		$('img').fadeIn('slow');
		},function(){
	//再显示出来
		$('img').fadeOut('slow');
			
	});
$('#btn2').toggle(function (){
		//先隐藏掉
		$('img').fadeTo('slow',0.66);
		},function(){
	//再显示出来
		$('img').fadeTo('slow',0.22);
			
	});
});
</script>

</head>

<body>
<p>我是李楠!!</p>
<p>我是李楠!!</p>
<p>我是李楠!!</p>
<img width="200px" height="200px" src="file:///D|/Program Files/wamp/www/2012/jQuery/images/12926034201734018.jpg">
<input type="button" id="btn0" value="显示/隐藏" />
<input type="button" id="btn1" value="淡入/淡出" />
<input type="button" id="btn2" value="淡入/淡出 效果 透明度0.66" />
</body>
</html>

PopWindows 底部显示与隐藏

參考链接: * http://blog.csdn.net/mannver/article/details/51399151 * http://104zz.iteye.com/blog/168538...
  • dirksmaller
  • dirksmaller
  • 2017年06月07日 23:29
  • 120

点击一个按钮显示div,点击div之外的地方div隐藏,点击div之内的地方div不隐藏

当点击按钮后显示隐藏层,满足鼠标在div里操作不隐藏,在外边点击会消失的功能。                                 逻辑上主要是阻止浏览器的冒泡            ...
  • w1019945543
  • w1019945543
  • 2017年07月13日 10:12
  • 1203

Js实现主页面中显示/隐藏层的效果

在坐Jsp界面Ajax效果时,总想实现主界面中,单击按钮弹出个小界面,使得主界面处于被锁状态,弹出的小界面方便我们编辑数据。有很多方式都可以解决,参考其它系统中的一种方式,实现起来比较方便:即 doc...
  • TnQin
  • TnQin
  • 2012年07月11日 16:43
  • 2830

iframe隐藏和显示

在...之间加入下列代码:显示iFrame隐藏iFrame 
  • derpvailzhangfan
  • derpvailzhangfan
  • 2007年04月14日 19:29
  • 3186

jquery设置DIV显示和隐藏

http://www.aichengxu.com/article/Javascript/908_7.html 今天一朋友问我 点击一按钮弹出一个DIV,然后要求点击页面其它地方隐藏这个DIV。 ...
  • mituan1234567
  • mituan1234567
  • 2013年09月12日 10:21
  • 1031

jQuery 弹窗

总结一些一个基于jQuery的弹出层插件。支持多窗口,拖动,最大化最小化,固定定位,相对于某个位置定位,具有简化的Tips模式。可以自定义外观等等,具体的看参数和演示 参数说明: 名称 说明 ty...
  • Demon_311
  • Demon_311
  • 2015年10月23日 09:55
  • 403

Fragment的隐藏与显示

package com.bwie.helpdemo; import com.bwie.fragment.BillFrag; import com.bwie.fragment.IndexFrag...
  • LM_ZP
  • LM_ZP
  • 2016年05月12日 09:32
  • 4348

selected选中后显示和隐藏div

1、select部分 --请选择-- 审核通过 审核不通过 2、显示和隐藏内容 不通过原因: 3、js部分 function showinfo(v...
  • qq_30776829
  • qq_30776829
  • 2017年07月18日 09:47
  • 375

hover 右侧的 | 隐藏

实现下图所示效果 鼠标经过的时候没有右侧的 |。一般的方法是用border-right。可是鼠标经过后一个a链接的时候,border-right还在。后来想的是在a链接下面加span标签,可是实...
  • u014665035
  • u014665035
  • 2016年11月09日 16:08
  • 109

xml不能里面的上下间隔问题 ,如果存在需要隐藏的项的时候 ,最好是在隐藏项加layout_marginBottom,而不用在下面那项加top

xml不能里面的上下间隔问题 ,如果存在需要隐藏的项的时候 ,最好是在隐藏项加layout_marginBottom,而不用在下面那项加top...
  • manlan123
  • manlan123
  • 2016年04月09日 10:19
  • 372
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:jquery-show()-显示和隐藏
举报原因:
原因补充:

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