Javascript mouse click event

[admin]

Try this, but it will only work correctly if all plans have the same width:

Code:

$(function(){
  var body = $(document.body), leftEl, rightEl, timeout;

  // only apply script to user mode visualization
  if (!body.hasClass('usermode')) {
    return;
  }

  // create overlay element
  leftEl = $('<div></div>').addClass('overlay-left').appendTo(body);
  leftEl.on('vclick', function() {
    alert('clicked left');
  });

  // create overlay element
  rightEl = $('<div></div>').addClass('overlay-right').appendTo(body);
  rightEl.on('vclick', function() {
    alert('clicked right');
  });
  
  function setSize() {
    var rect = $('.layer.plan:visible').get(0).getBoundingClientRect()
        , width = Math.ceil((body.width() - rect.width) / 2);
    
    width = Math.max(0, width);
    leftEl.css('width', width);
    rightEl.css('width', width);
  }
  
  $(window).on('orientationchange resize', function() {
    clearTimeout(timeout);
    timeout = setTimeout(setSize, 150);
  });
  
  setSize();
});