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 开发者_JS百科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

This tutorial on scrollbar parallax scrolling might be of some use;

http://inner.geek.nz/javascript/parallax/

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