Overflow scrolling for large numbers of group members on mobile devices

[JRDavisUF]

Anyone know a good way of dealing with a large number of items per group as then viewed from a mobile device? I know I need to do something with overflow scrolling, but I've not found a way to get them to show up on mobile devices. (something like -webkit-overflow-scrolling: touch perhaps)

Also, FWIW, my IE on W7 would not show the scroll bars either unless I changed overflow-y to scroll (always on) in ".ac-container input.menu:checked ~ article.ac-large"

thx.

jrd

PS A couple of other notes, for long group names, I was also having problems as the name would extend below its box and overwrite the first thing listed in the group. A simple fix was to change height to auto in ".ac-container label"...However, the whole reason it was going to a second line (Actually the last word of any long title would go to a second line), I believe was because the padding was insufficient to cover the size of the up arrow, changing padding to 2px 35px 2px 2px, seemed to fix that problem.

[stretchkerr]

I had a similar problem, and found a solution somewhere in GitHub, but cannot recall where. I found the important bits of code were:

.leaflet-control-layers { max-height: 90%; overflow: auto; }

within the style of the body html, and also

var options = { container_width : "220px", group_maxHeight : "240px", //container_maxHeight : "350px", exclusive : false };

        var control = L.Control.styledLayerControl(baseLayers, overlays, options);
        map.addControl(control);
  //---------ALLOWS SCROLLING OF THE LAYER CONTROL PANEL ON TOUCH DEVICES--------
  if (!L.Browser.touch) {
  L.DomEvent
  .disableClickPropagation(control._container)
  .disableScrollPropagation(control._container);
  } else {
  L.DomEvent.disableClickPropagation(control._container);
  }

My example: https://dl.dropboxusercontent.com/u/7075784/Leaflet/Leaflet2.html

7 layer groups, some with 7 to 11 sublayers. All scrolls fine within Chrome on Android tablet.