[jQuery] IE not working correctly with jQuery...
I have a simple webpage I'm using to test some example code for later
implementation. It works great in FF2 but in IE6 is won't render
correctly. Can anybody tell me what is wrong with this code?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<HTML>
<HEAD>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
pageEncoding="ISO-8859-1"%>
<META http-equiv="Content-Type" content="text/html;
charset=ISO-8859-1">
<meta name="GENERATOR" content="IBM Software Development Platform" />
<META http-equiv="Content-Style-Type" content="text/css">
<LINK href="SimpleTable.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="jquery112.js"></script>
<script type="text/javascript" src="interface.js"></script>
<script type="text/javascript" src="flydom311.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
var class;
$('#main').SlideInUp('slow');
$('.insert').hide();
$('.order').click( function(){$('.insert').toggle();});
$(".stripeMe tr").hover(function(){
class = $(this).attr("class");
$(this).removeClass().addClass("over");
},function(){
$(this).removeClass();
$(this).attr("class",class);
});
$(".stripeMe tr:even").addClass("alt");
});
</script>
<TITLE>SimpleTable.jsp</TITLE>
</HEAD>
<BODY>
<div class="main" id="main">
<table width="500px" border="0" cellpadding="0" cellspacing="0" >
<thead class="main">
<tr>
<th>Order</th>
<th> # of Lines </th>
<th>Purchase Order</th>
<th> Cust # </th>
</tr>
</thead>
<tbody class="stripeMe">
<tr>
<td class="order" id="466776">466776</td>
<td>4</td>
<td>4228</td>
<td>50096</td>
</tr>
<tr>
<td colspan="4">
<table class="insert" border="0" cellpadding="0" cellspacing="0"
width=95%>
<thead class="theadinsert">
<tr>
<th>Line</th>
<th>Date</th>
<th>Amount</th>
<th>User</th>
</tr>
</thead>
<tbody class="tbodyinsert">
<tr>
<td>1</td>
<td>today</td>
<td> 5.00</td>
<td>me</td>
</tr>
<tr>
<td>2</td>
<td>tomorrow</td>
<td>4.00</td>
<td>me</td>
</tr>
<tr>
<td>3</td>
<td>the next day</td>
<td>3.00</td>
<td>me</td>
</tr>
<tr>
<td>4</td>
<td>and the day after that</td>
<td>2.00</td>
<td>me</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr class="order" id="566852">
<td>566852</td>
<td>4</td>
<td>4228</td>
<td>50096</td>
</tr>
<tr>
<td colspan="4">
<table class="insert" border="0" cellpadding="0" cellspacing="0"
width=95%>
<thead>
<tr>
<th>Line</th>
<th>Date</th>
<th>Amount</th>
<th>User</th>
</tr>
</thead>
<tbody class="tbodyinsert">
<tr>
<td>1</td>
<td>today</td>
<td> 5.00</td>
<td>me</td>
</tr>
<tr>
<td>2</td>
<td>tomorrow</td>
<td>4.00</td>
<td>me</td>
</tr>
<tr>
<td>3</td>
<td>the next day</td>
<td>3.00</td>
<td>me</td>
</tr>
<tr>
<td>4</td>
<td>and the day after that and we'll see if this will wrap</
td>
<td>2.00</td>
<td>me</td>
</tr>
</tbody>
</table>
</td>
</tr>
<tr class="order">
<td>466776</td>
<td>4</td>
<td>4228</td>
<td>50096</td>
</tr>
<tr class="order">
<td>466776</td>
<td>4</td>
<td>4228</td>
<td>50096</td>
</tr>
<tr class="order">
<td>466776</td>
<td>4</td>
<td>4228</td>
<td>50096</td>
</tr>
</tbody>
</table>
</div>
</BODY>
</HTML>
I'm sure its some sort of workaround I need to do. Thanks for any
help.