title: Leafletjs Cursor when hovering over WMS Layer
body: <p>I am using <a href="http://leafletjs.com/" rel="nofollow noreferrer">Leafletjs</a>. Currently its pretty straight forward, I have a streets view from open maps. </p>
  
  <pre><code>var streets = L.tileLayer('http://{s}.tile.osm.org/{z}/{x}/{y}.png', {
          maxZoom: 18,
          attribution: 'Map data &amp;copy; &lt;a href="http://openstreetmap.org"&gt;OpenStreetMap&lt;/a&gt; contributors'
      });
  </code></pre>
  
  <p>I also have a WMS layer that is coming from a geoserver. It has the standard getFeatureInfo and everything shows up correctly. </p>
  
  <pre><code>L.tileLayer.wms("GEOSERVERURL", {
              layers: 'layers',
              format: 'image/png'
              ,transparent: true
          }).addTo(map);
  </code></pre>
  
  <p>The wms layer is also clickable and I use getFeatureInfo to get the info for that layer. The issue is that the user doesn't know its clickable because the cursor never changes when they hover of the wms layer. My question is how do make the cursor change when hovering over the layer? </p>
  
  <p>Has anyone implemented this feature before or have an idea to implement it? The only research I have stumbled across so far has using mouseover on the map and calling getFeatureInfo to tell if its over a layer. However, that seems like it would cause a lot of chatter just to identify cursor area. </p>
  
  <p>EDIT: To clarify, I want the cursor to only change when its hovered over the wms layer that is populated. Although it technically gets applied to the whole map, it only has content on a part of it. Which kind of raises the question of 'Can I limit the wms layer to only the content area and then show a cursor?' Maybe a bounding area or something along those lines?</p>
  
  <p>EDIT 2: Below is an example of what it looks like. The street map parts I want to keep the normal cursor but I want a pointer when hovering over the colored wms map parts.
  <img src="https://i.stack.imgur.com/1N3rj.png" alt="Example"></p>