My bad. I forgot the {} so there is a js error now .
corrected code :
<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:54 PM, David Blomstrom
<[EMAIL PROTECTED]>wrote:
> Sorry, when I pasted that script in, there were still no row colors, plus
> the sorting function sstopped working.
>
>
> On Tue, Dec 9, 2008 at 12:46 PM, Olivier Percebois-Garve <
> [EMAIL PROTECTED]> wrote:
>
>> 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
>>>
>>
>>
>
>
> --
> David Blomstrom
> Writer & Web Designer (Mac, M$ & Linux)
> www.geobop.org
>
