function initNav() {
  $('arrow_left').observe('mousedown', arrow_left);
  $('arrow_right').observe('mousedown', arrow_right);

  $$('.arrownav').invoke('observe', 'mouseover', arrow_over);
  $$('.arrownav').invoke('observe', 'mouseout',  arrow_out);
  
  $$('#navigatie a').invoke('observe', 'focus', function (e) { e.target.blur() } ); 
  $$('#rechts a.collaps').invoke('observe', 'focus', function (e) { e.target.blur() } ); 
}

function arrow_over(e) {
  a = e.target;
  
  var x = ($('menu').offsetLeft);
  if (a.id == 'arrow_left' && x == 0)
    return;
  
  var w = $('menu').offsetWidth - $('nav_container').offsetWidth;
  if (a.id == 'arrow_right' && (w + x == 0 || w < 0))
    return;

  if (a.id != 'arrow_right' && a.id != 'arrow_left' && a.getAttribute('href') == 'javascript:void(0)')
    return;
  
  a.style.backgroundPosition = '25px -80px';
}

function arrow_out(e) {
  a = e.target;
  a.style.backgroundPosition = '25px 0px';
}

function arrow_left() {
  var x = ($('menu').offsetLeft);
  var w1 = ($('menu').offsetWidth);
  var w2 = $('nav_container').offsetWidth;
  var dx = -x;
  if (dx > w2-100)
    dx = w2-100;

  new Effect.Move($('menu'), { x:dx, mode:'relative', duration:1.2, afterFinish: function(effect) 
      { if ($('menu').offsetLeft == 0) $('arrow_left').style.backgroundPosition = '25px 0px' } });
}

function arrow_right() {
  var x = ($('menu').offsetLeft);
  var w1 = ($('menu').offsetWidth);
  var w2 = $('nav_container').offsetWidth;
  if (w2 > w1)
    return;
  var dx = w1 - w2 + x;
  if (dx > w2-100)
    dx = w2-100;
    
  new Effect.Move($('menu'), { x:-dx, mode:'relative', duration:1.2, afterFinish: function(effect) 
      { if ($('menu').offsetWidth - $('nav_container').offsetWidth + $('menu').offsetLeft == 0) $('arrow_right').style.backgroundPosition = '25px 0px' } });
}




Event.observe(window, 'load', initNav, false);
