Skip to content

Instantly share code, notes, and snippets.

/fiddle.css

Created March 19, 2018 16:06
Show Gist options
  • Save anonymous/5448ffd37c9862d553e8ccec8b3916d7 to your computer and use it in GitHub Desktop.
Save anonymous/5448ffd37c9862d553e8ccec8b3916d7 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
fiddle.css
#lulz {
width:480px;
height:480px;
border-collapse:collapse;
}
#lulz td {
border: 2px solid black;
}
#lulz td.chosen {
border-color: red;
}
#lulz td.chosen-top {
border-bottom-color: red;
}
#lulz td.chosen-left {
border-right-color: red;
}
Raw
fiddle.html
<table id=lulz cellspacing=0 callpadding=0>
<tr><td><td><td><td><td><td>
<tr><td><td><td><td><td><td>
<tr><td><td><td><td><td><td>
<tr><td><td><td><td><td><td>
<tr><td><td><td><td><td><td>
<tr><td><td><td><td><td><td>
</table>
Raw
fiddle.js
function chooseCell(td){
if (chooseCell.currentCell) chooseCell.currentCell.className = '';
if (chooseCell.currentLeft) chooseCell.currentLeft.className = '';
if (chooseCell.currentTop) chooseCell.currentTop.className = '';
chooseCell.currentCell = td;
chooseCell.currentLeft = td.previousSibling;
chooseCell.currentTop = td.parentNode.rowIndex > 0 && td.parentNode.previousSibling.childNodes[td.cellIndex];
if (chooseCell.currentCell) chooseCell.currentCell.className = 'chosen';
if (chooseCell.currentLeft) chooseCell.currentLeft.className = 'chosen-left';
if (chooseCell.currentTop) chooseCell.currentTop.className = 'chosen-top';
}
lulz.onclick = function(event){
if (!event) event = window.event;
// this could be better :P
chooseCell(event.target);
};
chooseCell(lulz.getElementsByTagName('td')[-1 + 6 * 3 + 4])
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment