[thelist] CSS Woes

Jay Blanchard jblanchard at pocket.com
Tue May 8 13:56:49 CDT 2007


[snip]
if I understand correctly, your goal for the content area is to, on the
fly, display different columns of existing data, in a fashion suitable
for side-by-side comparison? (just wanna clarify that afore I ponder a
different solution)
[/snip]

Exactly. Lets say the 'table' has a 4 x 20 grid. I want to compare 3
models against 12 features. I could selectively 'hide' 8 rows of
features and one column of model, leaving me with a 3 x 12 'table'.

I know that I can do this in a couple of ways, but most require a
truckload of markup and they would all be crazy hacks. With CSS I can
create rows and columns that are 'selectable' for a condition using
basic javascript;

<script language="JavaScript">
	function toggleDiv(divid){
		if(document.getElementById(divid).style.display ==
'none'){
		    	document.getElementById(divid).style.display =
'block';
	    }else{
		    	document.getElementById(divid).style.display =
'none';
	    }
	}
</script>

In testing it all worked pretty well (still had some stuff to
troubleshoot) until I placed into the page with additional CSS. I
probably could put the whole shebang into an IFRAME so that it stands
alone, and I could probably style the IFRAME to have invisiable borders
and no scrollbars (hack consideration #1). It lacks neatness though. The
footer will not move up and down in relation to page content, it will be
below the IFRAME. Resizing the browser window will give some funky
effects.





More information about the thelist mailing list