Contextmenu for table rows

by uttara

HTML

<table>
    <tr>
        <td>http://www.google.com</td>
    </tr>
    <tr>
        <td>http://www.bing.com</td>
    </tr>
</table>
<div id="menu"><a id="menuLink" target="_blank" href="">Open in new window/tab</a></div>

CSS

#menu { z-index:100;display:none; position:absolute;border:1px solid red; background-color:grey }
#menuLink { text-decoration:none }
tr { border:1px solid black}

JavaScript

var trs = document.getElementsByTagName("tr");

for (var i=0,n=trs.length;i<n;i++) {
    trs[i].oncontextmenu=function(e) {
      document.getElementById("menuLink").href=this.cells[0].innerHTML;
      var menu = document.getElementById("menu");
      menu.style.left=(e)?e.pageX:event.clientX;
      menu.style.top=(e)?e.pageY:event.clientY;
      menu.style.display="block";
      return false;
    }
}
document.getElementById("menuLink").onclick=function() {
  document.getElementById("menu").style.display="none";
    // the following is not really needed since the target works
    // fine on its own
//    var w=window.open(this.href,this.target);
//    return w?false:true;
}