mirror of
https://github.com/alchemy-fr/Phraseanet.git
synced 2025-10-13 21:13:26 +00:00
421 lines
23 KiB
HTML
421 lines
23 KiB
HTML
<!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>Example: Adding A Context Menu To A Table (YUI Library)</title>
|
|
|
|
<!-- Standard reset and fonts -->
|
|
|
|
<link rel="stylesheet" type="text/css" href="../../build/reset/reset.css">
|
|
<link rel="stylesheet" type="text/css" href="../../build/fonts/fonts.css">
|
|
|
|
|
|
<!-- CSS for Menu -->
|
|
|
|
<link rel="stylesheet" type="text/css" href="../../build/menu/assets/skins/sam/menu.css">
|
|
|
|
|
|
<!-- Page-specific styles -->
|
|
|
|
<style type="text/css">
|
|
|
|
h1 {
|
|
|
|
font-weight: bold;
|
|
margin: 0 0 1em 0;
|
|
}
|
|
|
|
body {
|
|
|
|
padding: 1em;
|
|
|
|
}
|
|
|
|
p, ul {
|
|
|
|
margin: 1em 0;
|
|
|
|
}
|
|
|
|
|
|
p em,
|
|
#operainstructions li em {
|
|
|
|
font-weight: bold;
|
|
|
|
}
|
|
|
|
#operainstructions {
|
|
|
|
list-style-type: square;
|
|
margin-left: 2em;
|
|
|
|
}
|
|
|
|
#dataset {
|
|
|
|
border: solid 1px #000;
|
|
|
|
}
|
|
|
|
#dataset tr.odd {
|
|
|
|
background-color: #ccc;
|
|
|
|
}
|
|
|
|
|
|
#dataset tr.selected {
|
|
|
|
background-color: #039;
|
|
|
|
}
|
|
|
|
|
|
#dataset td {
|
|
|
|
border: solid 1px #000;
|
|
padding: .25em .5em;
|
|
|
|
}
|
|
|
|
</style>
|
|
|
|
|
|
<!-- Dependency source files -->
|
|
|
|
<script type="text/javascript" src="../../build/yahoo-dom-event/yahoo-dom-event.js"></script>
|
|
<script type="text/javascript" src="../../build/container/container_core.js"></script>
|
|
|
|
|
|
<!-- Menu source file -->
|
|
|
|
<script type="text/javascript" src="../../build/menu/menu.js"></script>
|
|
|
|
|
|
<!-- Page-specific script -->
|
|
|
|
<script type="text/javascript">
|
|
|
|
/*
|
|
Initialize the ContextMenu instance when the the elements
|
|
that trigger their display are ready to be scripted.
|
|
*/
|
|
|
|
YAHOO.util.Event.onContentReady("dataset", function () {
|
|
|
|
var Dom = YAHOO.util.Dom;
|
|
|
|
/*
|
|
Map of CSS class names to arrays of MenuItem
|
|
configuration properties.
|
|
*/
|
|
|
|
var oContextMenuItems = {
|
|
|
|
"type1": [
|
|
"Context Menu 1, Item 1",
|
|
{
|
|
text: "Context Menu 1, Item 2",
|
|
submenu: {
|
|
id: "submenu1",
|
|
lazyload: true,
|
|
itemdata: [
|
|
"Context Menu 1 Submenu, Item 1",
|
|
"Context Menu 1 Submenu, Item 2",
|
|
"Context Menu 1 Submenu, Item 3",
|
|
"Context Menu 1 Submenu, Item 4"
|
|
]
|
|
}
|
|
},
|
|
"Context Menu 1, Item 3",
|
|
"Context Menu 1, Item 4"
|
|
],
|
|
|
|
"type2": [
|
|
"Context Menu 2, Item 1",
|
|
"Context Menu 2, Item 2",
|
|
"Context Menu 2, Item 3",
|
|
"Context Menu 2, Item 4",
|
|
"Context Menu 2, Item 5",
|
|
"Context Menu 2, Item 6",
|
|
"Context Menu 2, Item 7",
|
|
"Context Menu 2, Item 8",
|
|
"Context Menu 2, Item 9",
|
|
"Context Menu 2, Item 10"
|
|
],
|
|
|
|
"type3": [
|
|
"Context Menu 3, Item 1",
|
|
"Context Menu 3, Item 2",
|
|
"Context Menu 3, Item 3",
|
|
"Context Menu 3, Item 4"
|
|
],
|
|
|
|
"type4": [
|
|
"Context Menu 4, Item 1",
|
|
"Context Menu 4, Item 2"
|
|
],
|
|
|
|
"type5": [
|
|
"Context Menu 5, Item 1",
|
|
"Context Menu 5, Item 2",
|
|
"Context Menu 5, Item 3",
|
|
"Context Menu 5, Item 4",
|
|
"Context Menu 5, Item 5",
|
|
"Context Menu 5, Item 6"
|
|
]
|
|
|
|
};
|
|
|
|
|
|
var oSelectedTR; // The currently selected TR
|
|
|
|
|
|
/*
|
|
"beforeshow" event handler for the ContextMenu instance -
|
|
replaces the content of the ContextMenu instance based
|
|
on the CSS class name of the <tr> element that triggered
|
|
its display.
|
|
*/
|
|
|
|
function onContextMenuBeforeShow(p_sType, p_aArgs) {
|
|
|
|
var oTarget = this.contextEventTarget,
|
|
aMenuItems,
|
|
aClasses;
|
|
|
|
|
|
if (this.getRoot() == this) {
|
|
|
|
/*
|
|
Get the <tr> that was the target of the
|
|
"contextmenu" event.
|
|
*/
|
|
|
|
oSelectedTR = oTarget.nodeName.toUpperCase() == "TR" ?
|
|
oTarget : Dom.getAncestorByTagName(oTarget, "TR");
|
|
|
|
|
|
/*
|
|
Get the array of MenuItems for the CSS class name from
|
|
the "oContextMenuItems" map.
|
|
*/
|
|
|
|
if (Dom.hasClass(oSelectedTR, "odd")) {
|
|
|
|
aClasses = oSelectedTR.className.split(" ");
|
|
|
|
aMenuItems = oContextMenuItems[aClasses[0]];
|
|
|
|
}
|
|
else {
|
|
|
|
aMenuItems = oContextMenuItems[YAHOO.lang.trim(oSelectedTR.className)];
|
|
|
|
}
|
|
|
|
|
|
// Remove the existing content from the ContentMenu instance
|
|
|
|
this.clearContent();
|
|
|
|
|
|
// Add the new set of items to the ContentMenu instance
|
|
|
|
this.addItems(aMenuItems);
|
|
|
|
|
|
// Render the ContextMenu instance with the new content
|
|
|
|
this.render();
|
|
|
|
|
|
/*
|
|
Highlight the <tr> element in the table that was
|
|
the target of the "contextmenu" event.
|
|
*/
|
|
|
|
Dom.addClass(oSelectedTR, "selected");
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
/*
|
|
"hide" event handler for the ContextMenu - used to
|
|
clear the selected <tr> element in the table.
|
|
*/
|
|
|
|
function onContextMenuHide(p_sType, p_aArgs) {
|
|
|
|
if (this.getRoot() == this && oSelectedTR) {
|
|
|
|
Dom.removeClass(oSelectedTR, "selected");
|
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
/*
|
|
Instantiate a ContextMenu: The first argument passed to the constructor
|
|
is the id for the Menu element to be created, the second is an
|
|
object literal of configuration properties.
|
|
*/
|
|
|
|
var oContextMenu = new YAHOO.widget.ContextMenu("contextmenu", {
|
|
trigger: "dataset",
|
|
lazyload: true
|
|
});
|
|
|
|
|
|
/*
|
|
Subscribe to the ContextMenu instance's "beforeshow" and
|
|
"hide" events.
|
|
*/
|
|
|
|
oContextMenu.subscribe("beforeShow", onContextMenuBeforeShow);
|
|
oContextMenu.subscribe("hide", onContextMenuHide);
|
|
|
|
});
|
|
|
|
</script>
|
|
|
|
</head>
|
|
<body class="yui-skin-sam">
|
|
|
|
<h1>Example: Adding A Context Menu To A Table (YUI Library)</h1>
|
|
|
|
<p>
|
|
When adding context menus to large data structures like a
|
|
<code><table></code> or large list (<code><ol></code>
|
|
or <code><ul></code>), it is recommended to bind a single
|
|
YAHOO.widget.ContextMenu instance to the structure's root element, than to a set
|
|
of its child nodes (<code><tr></code>s or <code><li></code>s).
|
|
|
|
Doing so significantly improves the performance of a web page or
|
|
application by reducing the number of "contextmenu" event handlers
|
|
as well as the number of YAHOO.widget.ContextMenu instances in memory.
|
|
</p>
|
|
|
|
<p>
|
|
This example demonstrates this technique, as well as how to create
|
|
a context-sensitive context menu; a context menu whose content
|
|
changes based on the element that triggered its display.
|
|
</p>
|
|
|
|
<p><em>Please Note:</em> Opera users will need to do the following to use this example:</p>
|
|
|
|
<ul id="operainstructions">
|
|
<li><em>Opera for Windows:</em> Hold down the control key and click with the left mouse button.</li>
|
|
<li><em>Opera for OS X:</em> Hold down the command key (⌘) and click with the left mouse button.</li>
|
|
</ul>
|
|
|
|
<table id="dataset">
|
|
<tr class="type5 odd"><td>Row 0, Column 1</td><td>Row 0, Column 2</td><td>Row 0, Column 3</td><td>Row 0, Column 4</td></tr>
|
|
<tr class="type3"><td>Row 1, Column 1</td><td>Row 1, Column 2</td><td>Row 1, Column 3</td><td>Row 1, Column 4</td></tr>
|
|
<tr class="type2 odd"><td>Row 2, Column 1</td><td>Row 2, Column 2</td><td>Row 2, Column 3</td><td>Row 2, Column 4</td></tr>
|
|
<tr class="type5"><td>Row 3, Column 1</td><td>Row 3, Column 2</td><td>Row 3, Column 3</td><td>Row 3, Column 4</td></tr>
|
|
<tr class="type3 odd"><td>Row 4, Column 1</td><td>Row 4, Column 2</td><td>Row 4, Column 3</td><td>Row 4, Column 4</td></tr>
|
|
<tr class="type1"><td>Row 5, Column 1</td><td>Row 5, Column 2</td><td>Row 5, Column 3</td><td>Row 5, Column 4</td></tr>
|
|
<tr class="type5 odd"><td>Row 6, Column 1</td><td>Row 6, Column 2</td><td>Row 6, Column 3</td><td>Row 6, Column 4</td></tr>
|
|
<tr class="type1"><td>Row 7, Column 1</td><td>Row 7, Column 2</td><td>Row 7, Column 3</td><td>Row 7, Column 4</td></tr>
|
|
<tr class="type5 odd"><td>Row 8, Column 1</td><td>Row 8, Column 2</td><td>Row 8, Column 3</td><td>Row 8, Column 4</td></tr>
|
|
<tr class="type4"><td>Row 9, Column 1</td><td>Row 9, Column 2</td><td>Row 9, Column 3</td><td>Row 9, Column 4</td></tr>
|
|
<tr class="type2 odd"><td>Row 10, Column 1</td><td>Row 10, Column 2</td><td>Row 10, Column 3</td><td>Row 10, Column 4</td></tr>
|
|
<tr class="type1"><td>Row 11, Column 1</td><td>Row 11, Column 2</td><td>Row 11, Column 3</td><td>Row 11, Column 4</td></tr>
|
|
<tr class="type2 odd"><td>Row 12, Column 1</td><td>Row 12, Column 2</td><td>Row 12, Column 3</td><td>Row 12, Column 4</td></tr>
|
|
<tr class="type2"><td>Row 13, Column 1</td><td>Row 13, Column 2</td><td>Row 13, Column 3</td><td>Row 13, Column 4</td></tr>
|
|
<tr class="type3 odd"><td>Row 14, Column 1</td><td>Row 14, Column 2</td><td>Row 14, Column 3</td><td>Row 14, Column 4</td></tr>
|
|
<tr class="type4"><td>Row 15, Column 1</td><td>Row 15, Column 2</td><td>Row 15, Column 3</td><td>Row 15, Column 4</td></tr>
|
|
<tr class="type4 odd"><td>Row 16, Column 1</td><td>Row 16, Column 2</td><td>Row 16, Column 3</td><td>Row 16, Column 4</td></tr>
|
|
<tr class="type5"><td>Row 17, Column 1</td><td>Row 17, Column 2</td><td>Row 17, Column 3</td><td>Row 17, Column 4</td></tr>
|
|
<tr class="type3 odd"><td>Row 18, Column 1</td><td>Row 18, Column 2</td><td>Row 18, Column 3</td><td>Row 18, Column 4</td></tr>
|
|
<tr class="type3"><td>Row 19, Column 1</td><td>Row 19, Column 2</td><td>Row 19, Column 3</td><td>Row 19, Column 4</td></tr>
|
|
<tr class="type3 odd"><td>Row 20, Column 1</td><td>Row 20, Column 2</td><td>Row 20, Column 3</td><td>Row 20, Column 4</td></tr>
|
|
<tr class="type1"><td>Row 21, Column 1</td><td>Row 21, Column 2</td><td>Row 21, Column 3</td><td>Row 21, Column 4</td></tr>
|
|
<tr class="type3 odd"><td>Row 22, Column 1</td><td>Row 22, Column 2</td><td>Row 22, Column 3</td><td>Row 22, Column 4</td></tr>
|
|
<tr class="type4"><td>Row 23, Column 1</td><td>Row 23, Column 2</td><td>Row 23, Column 3</td><td>Row 23, Column 4</td></tr>
|
|
<tr class="type3 odd"><td>Row 24, Column 1</td><td>Row 24, Column 2</td><td>Row 24, Column 3</td><td>Row 24, Column 4</td></tr>
|
|
<tr class="type4"><td>Row 25, Column 1</td><td>Row 25, Column 2</td><td>Row 25, Column 3</td><td>Row 25, Column 4</td></tr>
|
|
<tr class="type3 odd"><td>Row 26, Column 1</td><td>Row 26, Column 2</td><td>Row 26, Column 3</td><td>Row 26, Column 4</td></tr>
|
|
<tr class="type3"><td>Row 27, Column 1</td><td>Row 27, Column 2</td><td>Row 27, Column 3</td><td>Row 27, Column 4</td></tr>
|
|
<tr class="type1 odd"><td>Row 28, Column 1</td><td>Row 28, Column 2</td><td>Row 28, Column 3</td><td>Row 28, Column 4</td></tr>
|
|
<tr class="type2"><td>Row 29, Column 1</td><td>Row 29, Column 2</td><td>Row 29, Column 3</td><td>Row 29, Column 4</td></tr>
|
|
<tr class="type1 odd"><td>Row 30, Column 1</td><td>Row 30, Column 2</td><td>Row 30, Column 3</td><td>Row 30, Column 4</td></tr>
|
|
<tr class="type1"><td>Row 31, Column 1</td><td>Row 31, Column 2</td><td>Row 31, Column 3</td><td>Row 31, Column 4</td></tr>
|
|
<tr class="type5 odd"><td>Row 32, Column 1</td><td>Row 32, Column 2</td><td>Row 32, Column 3</td><td>Row 32, Column 4</td></tr>
|
|
<tr class="type2"><td>Row 33, Column 1</td><td>Row 33, Column 2</td><td>Row 33, Column 3</td><td>Row 33, Column 4</td></tr>
|
|
<tr class="type5 odd"><td>Row 34, Column 1</td><td>Row 34, Column 2</td><td>Row 34, Column 3</td><td>Row 34, Column 4</td></tr>
|
|
<tr class="type2"><td>Row 35, Column 1</td><td>Row 35, Column 2</td><td>Row 35, Column 3</td><td>Row 35, Column 4</td></tr>
|
|
<tr class="type2 odd"><td>Row 36, Column 1</td><td>Row 36, Column 2</td><td>Row 36, Column 3</td><td>Row 36, Column 4</td></tr>
|
|
<tr class="type4"><td>Row 37, Column 1</td><td>Row 37, Column 2</td><td>Row 37, Column 3</td><td>Row 37, Column 4</td></tr>
|
|
<tr class="type2 odd"><td>Row 38, Column 1</td><td>Row 38, Column 2</td><td>Row 38, Column 3</td><td>Row 38, Column 4</td></tr>
|
|
<tr class="type1"><td>Row 39, Column 1</td><td>Row 39, Column 2</td><td>Row 39, Column 3</td><td>Row 39, Column 4</td></tr>
|
|
<tr class="type3 odd"><td>Row 40, Column 1</td><td>Row 40, Column 2</td><td>Row 40, Column 3</td><td>Row 40, Column 4</td></tr>
|
|
<tr class="type3"><td>Row 41, Column 1</td><td>Row 41, Column 2</td><td>Row 41, Column 3</td><td>Row 41, Column 4</td></tr>
|
|
<tr class="type2 odd"><td>Row 42, Column 1</td><td>Row 42, Column 2</td><td>Row 42, Column 3</td><td>Row 42, Column 4</td></tr>
|
|
<tr class="type4"><td>Row 43, Column 1</td><td>Row 43, Column 2</td><td>Row 43, Column 3</td><td>Row 43, Column 4</td></tr>
|
|
<tr class="type5 odd"><td>Row 44, Column 1</td><td>Row 44, Column 2</td><td>Row 44, Column 3</td><td>Row 44, Column 4</td></tr>
|
|
<tr class="type4"><td>Row 45, Column 1</td><td>Row 45, Column 2</td><td>Row 45, Column 3</td><td>Row 45, Column 4</td></tr>
|
|
<tr class="type2 odd"><td>Row 46, Column 1</td><td>Row 46, Column 2</td><td>Row 46, Column 3</td><td>Row 46, Column 4</td></tr>
|
|
<tr class="type3"><td>Row 47, Column 1</td><td>Row 47, Column 2</td><td>Row 47, Column 3</td><td>Row 47, Column 4</td></tr>
|
|
<tr class="type4 odd"><td>Row 48, Column 1</td><td>Row 48, Column 2</td><td>Row 48, Column 3</td><td>Row 48, Column 4</td></tr>
|
|
<tr class="type4"><td>Row 49, Column 1</td><td>Row 49, Column 2</td><td>Row 49, Column 3</td><td>Row 49, Column 4</td></tr>
|
|
<tr class="type1 odd"><td>Row 50, Column 1</td><td>Row 50, Column 2</td><td>Row 50, Column 3</td><td>Row 50, Column 4</td></tr>
|
|
<tr class="type2"><td>Row 51, Column 1</td><td>Row 51, Column 2</td><td>Row 51, Column 3</td><td>Row 51, Column 4</td></tr>
|
|
<tr class="type5 odd"><td>Row 52, Column 1</td><td>Row 52, Column 2</td><td>Row 52, Column 3</td><td>Row 52, Column 4</td></tr>
|
|
<tr class="type4"><td>Row 53, Column 1</td><td>Row 53, Column 2</td><td>Row 53, Column 3</td><td>Row 53, Column 4</td></tr>
|
|
<tr class="type5 odd"><td>Row 54, Column 1</td><td>Row 54, Column 2</td><td>Row 54, Column 3</td><td>Row 54, Column 4</td></tr>
|
|
<tr class="type2"><td>Row 55, Column 1</td><td>Row 55, Column 2</td><td>Row 55, Column 3</td><td>Row 55, Column 4</td></tr>
|
|
<tr class="type2 odd"><td>Row 56, Column 1</td><td>Row 56, Column 2</td><td>Row 56, Column 3</td><td>Row 56, Column 4</td></tr>
|
|
<tr class="type2"><td>Row 57, Column 1</td><td>Row 57, Column 2</td><td>Row 57, Column 3</td><td>Row 57, Column 4</td></tr>
|
|
<tr class="type5 odd"><td>Row 58, Column 1</td><td>Row 58, Column 2</td><td>Row 58, Column 3</td><td>Row 58, Column 4</td></tr>
|
|
<tr class="type3"><td>Row 59, Column 1</td><td>Row 59, Column 2</td><td>Row 59, Column 3</td><td>Row 59, Column 4</td></tr>
|
|
<tr class="type4 odd"><td>Row 60, Column 1</td><td>Row 60, Column 2</td><td>Row 60, Column 3</td><td>Row 60, Column 4</td></tr>
|
|
<tr class="type5"><td>Row 61, Column 1</td><td>Row 61, Column 2</td><td>Row 61, Column 3</td><td>Row 61, Column 4</td></tr>
|
|
<tr class="type3 odd"><td>Row 62, Column 1</td><td>Row 62, Column 2</td><td>Row 62, Column 3</td><td>Row 62, Column 4</td></tr>
|
|
<tr class="type3"><td>Row 63, Column 1</td><td>Row 63, Column 2</td><td>Row 63, Column 3</td><td>Row 63, Column 4</td></tr>
|
|
<tr class="type1 odd"><td>Row 64, Column 1</td><td>Row 64, Column 2</td><td>Row 64, Column 3</td><td>Row 64, Column 4</td></tr>
|
|
<tr class="type2"><td>Row 65, Column 1</td><td>Row 65, Column 2</td><td>Row 65, Column 3</td><td>Row 65, Column 4</td></tr>
|
|
<tr class="type4 odd"><td>Row 66, Column 1</td><td>Row 66, Column 2</td><td>Row 66, Column 3</td><td>Row 66, Column 4</td></tr>
|
|
<tr class="type3"><td>Row 67, Column 1</td><td>Row 67, Column 2</td><td>Row 67, Column 3</td><td>Row 67, Column 4</td></tr>
|
|
<tr class="type1 odd"><td>Row 68, Column 1</td><td>Row 68, Column 2</td><td>Row 68, Column 3</td><td>Row 68, Column 4</td></tr>
|
|
<tr class="type1"><td>Row 69, Column 1</td><td>Row 69, Column 2</td><td>Row 69, Column 3</td><td>Row 69, Column 4</td></tr>
|
|
<tr class="type4 odd"><td>Row 70, Column 1</td><td>Row 70, Column 2</td><td>Row 70, Column 3</td><td>Row 70, Column 4</td></tr>
|
|
<tr class="type3"><td>Row 71, Column 1</td><td>Row 71, Column 2</td><td>Row 71, Column 3</td><td>Row 71, Column 4</td></tr>
|
|
<tr class="type3 odd"><td>Row 72, Column 1</td><td>Row 72, Column 2</td><td>Row 72, Column 3</td><td>Row 72, Column 4</td></tr>
|
|
<tr class="type5"><td>Row 73, Column 1</td><td>Row 73, Column 2</td><td>Row 73, Column 3</td><td>Row 73, Column 4</td></tr>
|
|
<tr class="type2 odd"><td>Row 74, Column 1</td><td>Row 74, Column 2</td><td>Row 74, Column 3</td><td>Row 74, Column 4</td></tr>
|
|
<tr class="type3"><td>Row 75, Column 1</td><td>Row 75, Column 2</td><td>Row 75, Column 3</td><td>Row 75, Column 4</td></tr>
|
|
<tr class="type4 odd"><td>Row 76, Column 1</td><td>Row 76, Column 2</td><td>Row 76, Column 3</td><td>Row 76, Column 4</td></tr>
|
|
<tr class="type4"><td>Row 77, Column 1</td><td>Row 77, Column 2</td><td>Row 77, Column 3</td><td>Row 77, Column 4</td></tr>
|
|
<tr class="type5 odd"><td>Row 78, Column 1</td><td>Row 78, Column 2</td><td>Row 78, Column 3</td><td>Row 78, Column 4</td></tr>
|
|
<tr class="type3"><td>Row 79, Column 1</td><td>Row 79, Column 2</td><td>Row 79, Column 3</td><td>Row 79, Column 4</td></tr>
|
|
<tr class="type3 odd"><td>Row 80, Column 1</td><td>Row 80, Column 2</td><td>Row 80, Column 3</td><td>Row 80, Column 4</td></tr>
|
|
<tr class="type1"><td>Row 81, Column 1</td><td>Row 81, Column 2</td><td>Row 81, Column 3</td><td>Row 81, Column 4</td></tr>
|
|
<tr class="type4 odd"><td>Row 82, Column 1</td><td>Row 82, Column 2</td><td>Row 82, Column 3</td><td>Row 82, Column 4</td></tr>
|
|
<tr class="type3"><td>Row 83, Column 1</td><td>Row 83, Column 2</td><td>Row 83, Column 3</td><td>Row 83, Column 4</td></tr>
|
|
<tr class="type4 odd"><td>Row 84, Column 1</td><td>Row 84, Column 2</td><td>Row 84, Column 3</td><td>Row 84, Column 4</td></tr>
|
|
<tr class="type3"><td>Row 85, Column 1</td><td>Row 85, Column 2</td><td>Row 85, Column 3</td><td>Row 85, Column 4</td></tr>
|
|
<tr class="type4 odd"><td>Row 86, Column 1</td><td>Row 86, Column 2</td><td>Row 86, Column 3</td><td>Row 86, Column 4</td></tr>
|
|
<tr class="type1"><td>Row 87, Column 1</td><td>Row 87, Column 2</td><td>Row 87, Column 3</td><td>Row 87, Column 4</td></tr>
|
|
<tr class="type5 odd"><td>Row 88, Column 1</td><td>Row 88, Column 2</td><td>Row 88, Column 3</td><td>Row 88, Column 4</td></tr>
|
|
<tr class="type4"><td>Row 89, Column 1</td><td>Row 89, Column 2</td><td>Row 89, Column 3</td><td>Row 89, Column 4</td></tr>
|
|
<tr class="type3 odd"><td>Row 90, Column 1</td><td>Row 90, Column 2</td><td>Row 90, Column 3</td><td>Row 90, Column 4</td></tr>
|
|
<tr class="type3"><td>Row 91, Column 1</td><td>Row 91, Column 2</td><td>Row 91, Column 3</td><td>Row 91, Column 4</td></tr>
|
|
<tr class="type3 odd"><td>Row 92, Column 1</td><td>Row 92, Column 2</td><td>Row 92, Column 3</td><td>Row 92, Column 4</td></tr>
|
|
<tr class="type5"><td>Row 93, Column 1</td><td>Row 93, Column 2</td><td>Row 93, Column 3</td><td>Row 93, Column 4</td></tr>
|
|
<tr class="type5 odd"><td>Row 94, Column 1</td><td>Row 94, Column 2</td><td>Row 94, Column 3</td><td>Row 94, Column 4</td></tr>
|
|
<tr class="type4"><td>Row 95, Column 1</td><td>Row 95, Column 2</td><td>Row 95, Column 3</td><td>Row 95, Column 4</td></tr>
|
|
<tr class="type2 odd"><td>Row 96, Column 1</td><td>Row 96, Column 2</td><td>Row 96, Column 3</td><td>Row 96, Column 4</td></tr>
|
|
<tr class="type4"><td>Row 97, Column 1</td><td>Row 97, Column 2</td><td>Row 97, Column 3</td><td>Row 97, Column 4</td></tr>
|
|
<tr class="type2 odd"><td>Row 98, Column 1</td><td>Row 98, Column 2</td><td>Row 98, Column 3</td><td>Row 98, Column 4</td></tr>
|
|
<tr class="type2"><td>Row 99, Column 1</td><td>Row 99, Column 2</td><td>Row 99, Column 3</td><td>Row 99, Column 4</td></tr>
|
|
</table>
|
|
|
|
</body>
|
|
</html> |