How to make OpenLayers 3 behave like Google Maps when using mouse scroll

Question

Google Maps API shows a message over the map when a user scrolls with mouse over the map.

The message advises the user to press the Control key while scrolling with the mouse over map. This is a very nice solution to preserve normal page scroll with the mouse.

Is this possible in OpenLayers 3?

Really there are two behaviors that we want to achieve:

1. How to detect that the user is doing scroll on the map with the mouse and show an alert that you must press control key?

2. How can you make it so the zoom on the map can only be done by pressing control in addition to scrolling with the mouse?

Answer 1

Here the answers to your questions:

1. How to detect that the user is doing scroll on the map with the mouse and show an alert that you must press control key?

map.on('wheel', function(){
       //write whatyou like and add it in popup window

});

2. How can you make it so the zoom on the map can only be done by pressing control in addition to scrolling with the mouse?

OpenLayers doesn't have this functionality but you can do it by creating something like in this link.

Also, you can do it with only (shift key) or (alt key)

     map.on('wheel', function(evt) {
            map.on('wheel', function(evt) {
    wheelZoom(evt);
});
function wheelZoom(evt) {
      if (ol.events.condition.shiftKeyOnly(evt) !== true) {
          evt.browserEvent.preventDefault();
      }
  };