sry. wrong paste:
$("table").tablesorter({
widgets: ['zebra']
});
On Tue, Dec 9, 2008 at 9:18 PM, Olivier Percebois-Garve <[EMAIL PROTECTED]
> wrote:
> The zebra code you have seems to be based on another library (Prototype ?),
> so it wont run using without it.
> Anyway, there's a zebra plugin included by default in the tablesorter.
> just do:
>
> $("table").tablesorter({
> widgets: ['zebra','repeatHeaders']
> });
>
>
>
> Olivier
>
>
>
>
> On Tue, Dec 9, 2008 at 9:01 PM, David Blomstrom <[EMAIL PROTECTED]
> > wrote:
>
>> I want to create a table that features sortable columns and alternate row
>> colors. I found scripts that do one or the other, but when I implement both,
>> the row color function is impaired.
>>
>> First, I downloaded the JQuery TableSorter plugin; hence the links to
>> jquery-1.2.6.min.js and jquery.tablesorter.js below. Below that is the
>> JavaScript for the "Zebra Stripes" function. When used together, the table
>> exhibits no row colors except when I mouseover a row.
>>
>> Does anyone know how I can fix this?
>>
>> Thanks.
>>
>> * * * * *
>>
>> <script src="/1A/JS/jquery-1.2.6.min.js" type="text/javascript"></script>
>>
>> <script src="/1A/JS/tablesorter/jquery.tablesorter.js"
>> type="text/javascript"></script>
>>
>>
>> <script language="JavaScript" type="text/JavaScript">
>> $(document).ready(function()
>> {
>> $("#myTable").tablesorter();
>> }
>> );
>> </script>
>>
>> <script type="text/javascript">
>> var Event = {
>> add: function(obj,type,fn) {
>> if (obj.attachEvent) {
>> obj['e'+type+fn] = fn;
>> obj[type+fn] = function() { obj['e'+type+fn](window.event); }
>> obj.attachEvent('on'+type,obj[type+fn]);
>> } else
>> obj.addEventListener(type,fn,false);
>> },
>> remove: function(obj,type,fn) {
>> if (obj.detachEvent) {
>> obj.detachEvent('on'+type,obj[type+fn]);
>> obj[type+fn] = null;
>> } else
>> obj.removeEventListener(type,fn,false);
>> }
>> }
>>
>> function $() {
>> var elements = new Array();
>> for (var i=0;i<arguments.length;i++) {
>> var element = arguments[i];
>> if (typeof element == 'string') element =
>> document.getElementById(element);
>> if (arguments.length == 1) return element;
>> elements.push(element);
>> }
>> return elements;
>> }
>>
>> String.prototype.trim = function() {
>> return this.replace(/^\s+|\s+$/,"");
>> }
>>
>> function addClassName(el,className) {
>> removeClassName(el,className);
>> el.className = (el.className + " " + className).trim();
>> }
>>
>> function removeClassName(el,className) {
>> el.className = el.className.replace(className,"").trim();
>> }
>>
>> var ZebraTable = {
>> bgcolor: '',
>> classname: '',
>> stripe: function(el) {
>> if (!$(el)) return;
>> var rows = $(el).getElementsByTagName('tr');
>> for (var i=1,len=rows.length;i<len;i++) {
>> if (i % 2 == 0) rows[i].className = 'alt';
>> Event.add(rows[i],'mouseover',function() { ZebraTable.mouseover(this);
>> });
>> Event.add(rows[i],'mouseout',function() { ZebraTable.mouseout(this); });
>> }
>> },
>> mouseover: function(row) {
>> this.bgcolor = row.style.backgroundColor;
>> this.classname = row.className;
>> addClassName(row,'over');
>> },
>> mouseout: function(row) {
>> removeClassName(row,'over');
>> addClassName(row,this.classname);
>> row.style.backgroundColor = this.bgcolor;
>> }
>> }
>>
>> window.onload = function() {
>> ZebraTable.stripe('myTable');
>> }
>>
>> </script>
>>
>>
>
