hover over is happening on everything now

Discussion in 'HTML & Website Design' started by neil patrick harris, Feb 15, 2008.

  1. #1
    http://www.plentyoftorrents.com/

    I'm pretty sure its this .css in the head of my page, that relates to my table.
    There is also a javascript that relates to it. Any ideas how I can block the effect from rubbing up on everything else on my page? I used to have the hover over addthis button but it was screwing that up as well. :(

    hideFromScreen {display:none;}
    
    	A { text-decoration:none }
    		a:link {
    	color: #000000;
    
    	}
        a:visited {
        color: #607ec5;
    
    	}
    a:hover {
    	color: #3366FF;
    	text-decoration: none;
    	}
    a:active {
    	color: #99ccff;
    	}
            table {
                text-align: left;
                font-size: 12px;
                font-family: book antiqua;
                background: #606060;
            }
            table thead {
                cursor: pointer;
            }
            table thead tr,
            table tfoot tr {
                background: url(images/tablemenu.png) repeat-x;
    
            }
            table tbody tr {
                background: #FFFFFF;
            }
    				table tbody tr:hover {
    				 background:	#F0F0F0;
    				}
    
            td, th {
             border: 1px solid black;
    
            }
                  th {
                     color:#ffffff;
                    }
    			</style>
    Code (markup):

    <script type="text/javascript" src="sortabletable.js"></script>
     
    neil patrick harris, Feb 15, 2008 IP
  2. neil patrick harris

    neil patrick harris Peon

    Messages:
    288
    Likes Received:
    4
    Best Answers:
    0
    Trophy Points:
    0
    #2
    and heres the javascript.
    /**
    *
    *  Sortable HTML table
    *  http://www.webtoolkit.info/
    *
    **/
    
    function SortableTable (tableEl) {
    
    	this.tbody = tableEl.getElementsByTagName('tbody');
    	this.thead = tableEl.getElementsByTagName('thead');
    	this.tfoot = tableEl.getElementsByTagName('tfoot');
    
    	this.getInnerText = function (el) {
    		if (typeof(el.textContent) != 'undefined') return el.textContent;
    		if (typeof(el.innerText) != 'undefined') return el.innerText;
    		if (typeof(el.innerHTML) == 'string') return el.innerHTML.replace(/<[^<>]+>/g,'');
    	}
    
    	this.getParent = function (el, pTagName) {
    		if (el == null) return null;
    		else if (el.nodeType == 1 && el.tagName.toLowerCase() == pTagName.toLowerCase())
    			return el;
    		else
    			return this.getParent(el.parentNode, pTagName);
    	}
    
    	this.sort = function (cell) {
    
    	    var column = cell.cellIndex;
    	    var itm = this.getInnerText(this.tbody[0].rows[1].cells[column]);
    		var sortfn = this.sortCaseInsensitive;
    
    		if (itm.match(/\d\d[-]+\d\d[-]+\d\d\d\d/)) sortfn = this.sortDate; // date format mm-dd-yyyy
    		if (itm.replace(/^\s+|\s+$/g,"").match(/^[\d\.]+$/)) sortfn = this.sortNumeric;
    
    		this.sortColumnIndex = column;
    
    	    var newRows = new Array();
    	    for (j = 0; j < this.tbody[0].rows.length; j++) {
    			newRows[j] = this.tbody[0].rows[j];
    		}
    
    		newRows.sort(sortfn);
    
    		if (cell.getAttribute("sortdir") == 'down') {
    			newRows.reverse();
    			cell.setAttribute('sortdir','up');
    		} else {
    			cell.setAttribute('sortdir','down');
    		}
    
    		for (i=0;i<newRows.length;i++) {
    			this.tbody[0].appendChild(newRows[i]);
    		}
    
    	}
    
    	this.sortCaseInsensitive = function(a,b) {
    		aa = thisObject.getInnerText(a.cells[thisObject.sortColumnIndex]).toLowerCase();
    		bb = thisObject.getInnerText(b.cells[thisObject.sortColumnIndex]).toLowerCase();
    		if (aa==bb) return 0;
    		if (aa<bb) return -1;
    		return 1;
    	}
    
    	this.sortDate = function(a,b) {
    		aa = thisObject.getInnerText(a.cells[thisObject.sortColumnIndex]);
    		bb = thisObject.getInnerText(b.cells[thisObject.sortColumnIndex]);
    		date1 = aa.substr(6,4)+aa.substr(3,2)+aa.substr(0,2);
    		date2 = bb.substr(6,4)+bb.substr(3,2)+bb.substr(0,2);
    		if (date1==date2) return 0;
    		if (date1<date2) return -1;
    		return 1;
    	}
    
    	this.sortNumeric = function(a,b) {
    		aa = parseFloat(thisObject.getInnerText(a.cells[thisObject.sortColumnIndex]));
    		if (isNaN(aa)) aa = 0;
    		bb = parseFloat(thisObject.getInnerText(b.cells[thisObject.sortColumnIndex]));
    		if (isNaN(bb)) bb = 0;
    		return aa-bb;
    	}
    
    	// define variables
    	var thisObject = this;
    	var sortSection = this.thead;
    
    	// constructor actions
    	if (!(this.tbody && this.tbody[0].rows && this.tbody[0].rows.length > 0)) return;
    
    	if (sortSection && sortSection[0].rows && sortSection[0].rows.length > 0) {
    		var sortRow = sortSection[0].rows[0];
    	} else {
    		return;
    	}
    
    	for (var i=0; i<sortRow.cells.length; i++) {
    		sortRow.cells[i].sTable = this;
    		sortRow.cells[i].onclick = function () {
    			this.sTable.sort(this);
    			return false;
    		}
    	}
    
    }
    Code (markup):
    :(
     
    neil patrick harris, Feb 15, 2008 IP
  3. TechnoGeek

    TechnoGeek Peon

    Messages:
    258
    Likes Received:
    6
    Best Answers:
    0
    Trophy Points:
    0
    #3
    Can you please elaborate on your trouble? I visited the site and didn't find anything abnormal.
    (Using Firefox 2.)
     
    TechnoGeek, Feb 15, 2008 IP
  4. neil patrick harris

    neil patrick harris Peon

    Messages:
    288
    Likes Received:
    4
    Best Answers:
    0
    Trophy Points:
    0
    #4
    Its made a border around the google search and the bottom adbrite ads. Those both have hover over effects now in FF.:(
     
    neil patrick harris, Feb 16, 2008 IP
  5. TechnoGeek

    TechnoGeek Peon

    Messages:
    258
    Likes Received:
    6
    Best Answers:
    0
    Trophy Points:
    0
    #5
    I suppose that when you say "hover over" you are referring to the effect that is achieved using JavaScript coding so that when the mouse is passed over a portion of the Web page this portion changes in some way.

    I suppose that what you are saying is that the Google box and the Adbrite ads experiment an effect similar to the one just described.

    Well, I don't appreciate any such effect when I pass the mouse over these regions. I am using Firefox 2.0.0.12.
     
    TechnoGeek, Feb 17, 2008 IP