You can see that I tried this formula: pos + trig * dimension. I hoped it would give me the right coordinates so that I can construct my diamond grid. So my question is, how can I align the diamond borders with trigonometry?
var div = document.getElementsByTagName('div'); var x1 = div.offsetTop + Math.cos(45) * div.offsetHeight; var y1 = div.offsetLeft + Math.sin(45) * div.offsetWidth; div.style.top = y1 + 'px'; div.style.left = x1 + 'px';
The entire jsfiddle can be found here: https://jsfiddle.net/hmfxmvvs/