[SOLVED] How do I pan the contents of a div when the right mouse button is dragged?

How do I pan the contents of a div when the right mouse button is dragged?

I need a cross browser way of capturing the right mouse click, preventing the default context menu and making it where when the user drags the mouse they can pan the contents of a div. This is largely similar to Google maps in that they will grip the contents and drag to see what they want.

No external libraries please.

I am already capturing the events, and know that this will prevent default actions:

  if (evt.preventDefault)
 {
        evt.preventDefault();
 }
    else
 {
        evt.returnValue = false;
 }

But this doesn't prevent the context menu AFAIK.

Edit: I really am unsure about how to prevent the context menu and what the best way to manipulate the scroll bars would be? examples would be great

Solution

So I'm using oncontextmenu="return false" which I know can be over-ridden by user preference but for those people they can use the menu bar options at the top of my app.

To handle the scrolling I am just modifying div.scrollLeft and div.scrollTop