478504 (1) [Avatar] Offline
#1
I am just getting started. The code is small so I include here.

Can someone tell me what I must do/add to get "stripes"
appear in my Mozilla Firefox browser like in Figure 3.2.

Thank you.

andrew.m.neiderer@gmail.com


------------------------------------------------------------------------------------------------------------
<?xml version="1.0" encoding="UTF-8"?>
<!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"
style="width:100%; height:100%; border:0; margin:0; padding:0;">
<head>
<!-- FileName: zebraStripes.xhtml -->
<!-- -->
<!-- Description: alternating backgrounds in a table; -->
<!-- pp. 67-68 of jQuery in Action (2nd edition), -->
<!-- Manning Publications, 2010. -->
<!-- -->
<!-- By: Bear Bibeault and Yehuda Katz. -->
<!-- -->
<!-- Modified: Andrew M. Neiderer. 3 July 2017. -->

<meta http-equiv="X-UA-Compatible" content="chrome=1"/>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/>

<!-- external cascading style sheet (CSS); -->
<!-- internal CSS. -->
<link rel="stylesheet" type="text/css"
href="/home/andrewmneiderer/libs/core.css"/>
<style type="text/css">
body, td {
font-size: 10pt;
}
table {
background-color: black;
border: 1px black solid;
border-collapse: collapse;
width: 480px;
}
th {
border: 2px ridge maroon;
background-color: maroon;
color: white;
padding: 3px 12px;
}
tr {
background-color: white;
margin: 1px;
}
tr.striped {
background-color: gold;
}
td {
padding: 1px 8px;
}
</style>

<!-- jQuery library -->
<script type="text/javascript"
src="/home/andrewmneiderer/libs/jquery-1.4.js"/>

<!-- add striped class -->

<script type="text/javascript">
$(function()
{
$("table tr:nth-child(even)").addClass("striped");
$("table").mouseover(swapThem).mouseout(swapThem);
});

function swapThem()

{
$('tr').toggleClass('striped');
}
</script>

<title>
Disco Zebra Stripes!
</title>
</head>

<body>
<table>
<tr>
<th> Year </th>
<th> Make </th>
<th> Model </th>
</tr>
<tr>
<td> 1965 </td>
<td> Ford </td>
<td> Mustang </td>
</tr>

<tr>
<td> 1970 </td>
<td> Toyota </td>
<td> Corolla </td>
</tr>
<tr>
<td> 1979 </td>
<td> AMC </td>
<td> Jeep CJ-5 </td>
</tr>

<tr>
<td> 1983 </td>
<td> Ford </td>
<td> EXP </td>
</tr>
<tr>
<td> 1985 </td>
<td> Dodge </td>
<td> Daytona </td>
</tr>
<tr>
<td> 1990 </td>
<td> Chrysler </td>
<td> Jeep Wrangler Sahara </td>
</tr>
<tr>
<td> 1995 </td>
<td> Ford </td>
<td> Ranger </td>
</tr>
<tr>
<td> 1997 </td>
<td> Chrysler </td>
<td> Jeep Wrangler Sahara </td>
</tr>
<tr>
<td> 2000 </td>
<td> Chrysler </td>
<td> Jeep Wrangler Sahara </td>
</tr>
<tr>
<td> 2005 </td>
<td> Chrysler </td>
<td> Jeep Wrangler Unlimited </td>
</tr>
<tr>
<td> 2007 </td>
<td> Dodge </td>
<td> Caliber R/T </td>
</tr>
</table>
</body>
</html>