Skip to main content

Bug Tracker

Side navigation

Ticket #3331: testcase.html


File testcase.html, 1.1 KB (added by jeff_themovie, May 14, 2009 02:17AM UTC)

test case - notice what happens when the red box is hidden in IE

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
	<meta http-equiv="content-type" content="text/html; charset=utf-8">
	<title>curCSS test case</title>
	<script type="text/javascript" src="jquery-1.3.2.js"></script>
	<script type="text/javascript">
		$(function () {
			var box = $('#box');

			$('#toggle').click(function () {
				// keep things simple
				if (box.is(':animated')) {
					return;
				}

				if (box.is(':hidden')) {
					box.animate({ marginTop: '-8em', height: 'show' }, 'slow');
				} else {
					box.animate({ marginTop: '0', height: 'hide' }, 'slow');
				}
			});
		});
	</script>
	<style type="text/css">
	#wrapper {
		background-color: green;
		height: 1em;
		margin-top: 10em;
		position: relative;
		width: 5em;
	}
	#box {
		background-color: red;
		display: none;
		height: 8em;
		left: 0;
		position: absolute;
		top: 0;
		width: 5em;
	}
	#toggle {
		margin-top: 1em;
	}
	</style>
</head>
<body>
<div id="wrapper"><div id="box">content</div></div>
<input type="button" id="toggle" value="toggle" />
</body>
</html>

Download in other formats:

Original Format