Skip to main content

Bug Tracker

Side navigation

Ticket #6224: bug.html


File bug.html, 1.2 KB (added by hughbiquitous, March 04, 2010 06:38PM UTC)

Click on "Tab 2" in IE8; results in an attempt to set "display" style to "0px"

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
	<script src="http://code.jquery.com/jquery-1.4.2.js" type="text/javascript"></script>
	<style>
		#tabs li { display: inline-block; padding: 10px; background-color: #ccc; margin: 0px 2px 0px 0px}
		#tabs { list-display-type: none; padding: 0; margin: 0 }
		.panel { display: none; }
		.panel.visible { display: block }
	</style>
</head>
<body>
	<ul id="tabs">
		<li panel="d1">Tab 1</li>
		<li panel="d2">Tab 2</li>
	</ul>
	<div id="d1" class="panel visible" style="background-color:#f00;padding:20px">Div 1</div>
	<div id="d2" class="panel" style="background-color:#00f;padding:20px">Div 2</div>
	<script type="text/javascript">
    	$().ready(function() {
    		$("#tabs li")
    			.css("cursor", "pointer")
    			.click(function() {
    				$(".panel:visible").fadeOut(200);
    				$("#" + $(this).attr("panel")).delay(200).animate({ "opacity": "toggle", "display": "toggle" }, 200);
    			})
    	});
	</script>
</body>
</html>

Download in other formats:

Original Format