ok. do that instead:
<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( widgets: ['zebra'] );
}
);
</script>
On Tue, Dec 9, 2008 at 9:43 PM, David Blomstrom
<[EMAIL PROTECTED]>wrote:
> Thanks.
>
> I changed my code accordingly...
>
> <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>
> $("table").tablesorter({
> widgets: ['zebra']
> });
> </script>
>
> * * * * *
>
> But it works just as before; there are no table colors except when I
> mouseover a row.
>
> I'm assuming I only need to add the proper CSS.
>
> According to this page -
> http://docs.jquery.com/Tutorials:Zebra_Striping_Made_Easy - I need to
> create CSS styles for .alt and .over. In fact, I already have those styles,
> yet there's no background color.
>
> Any tips?
>
> Thanks.
>
>
> On Tue, Dec 9, 2008 at 12:19 PM, Olivier Percebois-Garve <
> [EMAIL PROTECTED]> wrote:
>
>> 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>
>>>>
>>>>
>>>
>>
>
>
> --
> David Blomstrom
> Writer & Web Designer (Mac, M$ & Linux)
> www.geobop.org
>
