Is there any cross browser way to scroll the horizontal scroll bar of an IFrame with super wide content with Javascript inside the parent frame. Also I need it to be attached to the mouse wheel event.

This is what I have so far, it's a bit copy and paste at the moment and doesn't work unfortunately.

//var myIframe = document.getElementById('iframeWithWideContent');
//myIframe.onload = function (myIframe) {
  var mouseWheelEvt = function (e){
    var event = e || window.event;
    if (document.body.doScroll){
        document.body.doScroll(event.wheelDelta>0?"left":"right");
    }else if ((event.wheelDelta || event.detail) > 0){
        document.body.scrollLeft -= 10;
    }else{
        document.body.scrollLeft += 10;
    }
    return false;
  }
  if ("onmousewheel" in document.body){
    document.body.onmousewheel = mouseWheelEvt;
  }else{
    document.body.addEventListener("DOMMouseScroll", mouseWheelEvt);
  }
//}?

I probably should uncomment that code, replace document.body with myIframe though I wouldn't know what I'm doing wrong.

Demo on JSBIN
link fixed

Any help from you JavaScript Lords would be very appreciated. Thank you!