Vraag & Antwoord

Webdesign (HTML, CSS, Flash)

Is dit ook mogelijk met css?

Is het effect zoals ik hieronder gemaakt heb ook te doen met css? Het hoeft alleen maar in Mozilla te werken. [code:1:689e9ef4e4] <html> <head> <title>Untitled</title> <style type="text/css"> table {empty-cells: show} td{ text-align:center; width:50px; height:50px; border:1px solid black; border-collapse:separate; border-spacing:10px; cursor:default; } </style> </head> <body> <table id="t"><tr><td>1*1</td><td>2*1</td><td>3*1</td><td>4*1</td></tr><tr><td>1*2</td><td>2*2</td><td>3*2</td><td>4*2</td></tr><tr><td>1*3</td><td>2*3</td><td>3*3</td><td>4*3</td></tr> <tr><td>1*4</td><td>2*4</td><td>3*4</td><td>4*4</td></tr></table> <script type="text/javascript"> var x=document.getElementById('t'); var y=x.getElementsByTagName('td'); for (var i=0;i<y.length;i++){ y[i].onmouseover=function(){var g=this;var j=0;var k=0;var h=this.parentNode; while (g){j++;g=g.previousSibling;} while (h){k++;h=h.previousSibling;} window.status=k; for (var l=0;l<y.length;l++){ if (((l%4)<j)&&(Math.floor(l/4)<k)){y[l].style.backgroundColor='green'} else{y[l].style.backgroundColor='white';}; } } } </script> </body> </html> [/code:1:689e9ef4e4] Met :hover valt wel een en ander te doen, maar na wat pogingen gedaan te hebben, krijg ik toch het idee dat ik dit niet met css kan oplossen. Misschien kan iemand mij het tegendeel bewijzen?

Anoniem
hulpje