[Top][All Lists]
[Date Prev][Date Next][Thread Prev][Thread Next][Date Index][Thread Index]
[emacs-wiki-discuss] Striped Tables (from Ephrem)
From: |
Sandra Jean Chua |
Subject: |
[emacs-wiki-discuss] Striped Tables (from Ephrem) |
Date: |
Thu, 15 Apr 2004 10:47:50 -0400 |
User-agent: |
Internet Messaging Program (IMP) 4.0-cvs |
ephrem AT tuirgin.com wrote:
----------------------------------------------------------------
Here's a bit of magic to make fancy striped tables. The javascript is from
http://alistapart.com/articles/zebratables/. 4 steps. One caveat, if you have
multiple tables on a page (not including headers and footers) this
could result
in multiple instances of id="tabular". If anyone knows how to adapt the
javascript to identify class instead of id, that would be an improvement.
1) Edit emacs-wiki-publishing-header and add this javascript somewhere within
the head tag:
<script type=\"text/javascript\">
<!--
// this function is need to work around
// a bug in IE related to element attributes
function hasClass(obj) {
var result = false;
if (obj.getAttributeNode(\"class\") != null) {
result = obj.getAttributeNode(\"class\").value;
}
return result;
}
function stripe(id) {
// the flag we'll use to keep track of
// whether the current row is odd or even
var even = false;
// if arguments are provided to specify the colours
// of the even & odd rows, then use the them;
// otherwise use the following defaults:
var evenColor = arguments[1] ? arguments[1] : \"#fff\";
var oddColor = arguments[2] ? arguments[2] : \"#eee\";
// obtain a reference to the desired table
// if no such table exists, abort
var table = document.getElementById(id);
if (! table) { return; }
// by definition, tables can have more than one tbody
// element, so we'll have to get the list of child
// <tbody>s
var tbodies = table.getElementsByTagName(\"tbody\");
// and iterate through them...
for (var h = 0; h < tbodies.length; h++) {
// find all the <tr> elements...
var trs = tbodies[h].getElementsByTagName(\"tr\");
// ... and iterate through them
for (var i = 0; i < trs.length; i++) {
// avoid rows that have a class attribute
// or backgroundColor style
if (!hasClass(trs[i]) && ! trs[i].style.backgroundColor) {
// get all the cells in this row...
var tds = trs[i].getElementsByTagName(\"td\");
// and iterate through them...
for (var j = 0; j < tds.length; j++) {
var mytd = tds[j];
// avoid cells that have a class attribute
// or backgroundColor style
if (! hasClass(mytd) && ! mytd.style.backgroundColor) {
mytd.style.backgroundColor = even ? evenColor : oddColor;
}
}
}
// flip from odd to even, or vice-versa
even = ! even;
}
}
}
// -->
</script>
2) Edit emacs-wiki-publishing-header so that the body tag has an
onload attribute as follows:
<body onload=\"stripe('tabular', '#fff', '#edf3fe');\">
3) Edit emacs-wiki-table-attributes so that it includes
id="tabular":
(setq emacs-wiki-table-attributes "id=\"tabular\" border=\"0\"
cellpadding=\"2\" cellspacing=0")
4) Add something like the following to your stylesheet:
/*
// Only tables with the "tabular" id, thereby avoiding header
// and footer tables.
*/
table#tabular {
border: 3px solid #555;
}
/*
// Apply border to all td elements which are not in the first row.
*/
table#tabular tr + tr>td {
border-top: 1px solid #aaa;
}
table#tabular td {
padding: .5ex .5em;
}
/*
// Apply left border to all columns except the first.
*/
table#tabular td + td {
border-left: 1px dotted #aaa;
}
- Re: [emacs-wiki-discuss] Re: Planner trying to open links with web browser, (continued)
- Re: [emacs-wiki-discuss] Re: Planner trying to open links with web browser, Jody Klymak, 2004/04/14
- [emacs-wiki-discuss] Planner - Tasks on hold, ephrem, 2004/04/14
- [emacs-wiki-discuss] Re: Planner - Tasks on hold, Sacha Chua, 2004/04/14
- [emacs-wiki-discuss] planner--dev--1.0--patch-31 bug w/ "P" status and planner-carry-tasks-forward, ephrem, 2004/04/16
- [emacs-wiki-discuss] emacs-wiki-index/planner-index, ephrem, 2004/04/16
- [emacs-wiki-discuss] Re: emacs-wiki-index/planner-index, Sacha Chua, 2004/04/17
- [emacs-wiki-discuss] Re: planner--dev--1.0--patch-31 bug w/ "P" status and planner-carry-tasks-forward, Sacha Chua, 2004/04/17
- Re: [emacs-wiki-discuss] Re: Planner trying to open links with web browser, John Sullivan, 2004/04/14
- Re: [emacs-wiki-discuss] Re: Planner trying to open links with web browser, John Sullivan, 2004/04/14
- [emacs-wiki-discuss] Re: Planner trying to open links with web browser, Sacha Chua, 2004/04/15
- [emacs-wiki-discuss] Striped Tables (from Ephrem),
Sandra Jean Chua <=