I have a pop-up div. Basically what i want is when the pop-up div display:visible to cancel any onmouseover events. how do i do that?

in simple, when div is visible, cancel onmouseover. then when div display:none, then enable onmouseover?

Easiest way is probably to insert a test into the mouseover handler(s) such that they return immediately when the popup is displayed, without performing their normal action.

For example:

function mouseOverHandler(){
  var popup = document.getElementById('popup');
  if(popup && popup.style.display == 'block') {
  // ...............
  // normal action
  // ...............

If you have more than one handler that needs to perform this test, then you might choose to put the popup test into a function eg. popupOpen() such that you can perform the test with.

if (popupOpen()) { return; }

An alternative approach might be to detatch/reattach the mouseover handlers dynamically but I think this would involve more programming effort unless your code is already organised that way.