Can ScrollWheel be disabled in a custom street view?

Question

I am building a site and I have a page which takes an address and uses it to generate a 2D roadmap style google-map and then next to it, the street view for that address.

My problem is that these two maps span almost the entire width of the site and the user is likely to have their mouse go over it when scrolling down the page and get confused by their inability to scroll down further (while zooming into a map).

Disabling this for the 2D map was pretty strait forward

    //works to disable scroll wheel in 2D map   
var mapOptions = {
  zoom: 12,
  center: latlng,
  scrollwheel: false,
  mapTypeId: google.maps.MapTypeId.ROADMAP
};
map = new google.maps.Map(document.getElementById("map_canvas"), mapOptions );

//not working to disable scroll wheel in panorama
var panoramaOptions = {
  position: results[0].geometry.location,
  scrollwheel: false
};

panorama = new  google.maps.StreetViewPanorama(document.getElementById("map_canvas2"), panoramaOptions );

but the street view does not seem to allow me to disable the scroll wheel using these options and I am not able to find this issue addressed in the google-docs. Anyone know if this CAN be done or suggestions on how to approach it?

Answer 1

Don't know about the javascript way, but with html and css you can place an invisible div with higher z-index over the map/streetview.

Answer 2

I am having the same problem, when the user scrolls down using the mouse wheel, the cursor gets caught in the Google street view and starts zooming instead of scrolling down the page.

In Google Maps they provide the scrollwheel property which can disable this, but unfortunately this does not seem to be implemented in Street view.

The only workaround I found as of now is as @bennedich said in the previous answer, I placed an empty/transparent div exactly over the street view div.

I am enabling the controls when the user clicks anywhere over the street view area by using jQuery to hide this empty div (using css visibility property) on mousedown event and when the user moves his mouse out I am placing this empty div back over. Which basically means everytime the user wants to interact with the street view control he has to click it once. It's not the best solution but it's better than getting your mouse caught up when scrolling