Difference between revisions of "Complex Tables Favlet"

From Level Access Web Labs
Jump to navigation Jump to search
(Clean up the instructions on how to "install" the Favlet)
Line 1: Line 1:
Right click or press the applications key on this link.  Choose Add to Favorites or Add to Bookmarks to add this Favlet to your Favorites or Bookmarks.
+
IE or Firefox: Right click or press the applications key on the Favlet link.  Choose Add to Favorites, Add to Bookmarks or Bookmark this Link to add this Favlet to your Favorites or Bookmarks.
 +
 
 +
Chrome or Safari: drag the Favlet link to your browser's bookmarks bar.
  
 
This Favlet takes the associated header cell content from each cell referenced by a headers attribute and places them on-screen in the data cell in the same way that a screen reader may present the headers to users of the screen reader.
 
This Favlet takes the associated header cell content from each cell referenced by a headers attribute and places them on-screen in the data cell in the same way that a screen reader may present the headers to users of the screen reader.

Revision as of 21:45, 6 November 2018

IE or Firefox: Right click or press the applications key on the Favlet link. Choose Add to Favorites, Add to Bookmarks or Bookmark this Link to add this Favlet to your Favorites or Bookmarks.

Chrome or Safari: drag the Favlet link to your browser's bookmarks bar.

This Favlet takes the associated header cell content from each cell referenced by a headers attribute and places them on-screen in the data cell in the same way that a screen reader may present the headers to users of the screen reader.

Complex Tables Favlet

Sample code

javascript:(function(){

var el = document.querySelectorAll('td, th');  

var str;
var headers=[];
var sentinel;

if (el.length>0) {
 	for (var i=0; i<el.length; i++) {
			if (el.item(i).hasAttribute('headers')) {
				str = el.item(i).getAttribute('headers');
				headers = str.split(' ');
				for (var ii=0; ii < headers.length; ii++) {	
					if (document.getElementById(headers[ii])) {
						sentinel = 1;
						s = document.createElement('Span');
						t = document.createTextNode(document.getElementById(headers[ii]).textContent+" ");
						s.appendChild(t);
						s.style.backgroundColor = 'antiqueWhite';	
						s.style.color = 'black';
						el.item(i).appendChild(s);
					}
				}

			 } 
		 str='';
		 header='';
		 t='';
	}
	if (!sentinel) {
	  alert('no valid headers found');
	}
}
else {
  alert('No table cells found');
}	

})();