Invalid workaround for mobile Safari under Overflow:auto

1. Add the code to the CSS file:

::-webkit-scrollbar {
-webkit-appearance:none; /* To remove the system default style */
width:7px; /* scroll bar Width */
}
::-webkit-scrollbar-thumb {/* When focus is not in the state of the current zone slider */
border-radius:4px;
Background-color:rgba (0,0,0,.5);
-webkit-box-shadow:0 0 1px rgba (255,255,255,.5);
}

2. Simulate scroll bar effect

function Touchscroll (ID) {

    if (Istouchdevice ()) {

        var el = document.getElementById (ID);

        var scrollstartpos = 0;

        document.getElementById (ID). AddEventListener ("Touchstart",

            function (event) {

                Scrollstartpos = This.scrolltop + event.touches[0].pagey;

                Event.preventdefault ();

            },false);

        document.getElementById (ID). AddEventListener ("Touchmove",

            function (event) {

                This.scrolltop = Scrollstartpos-event.touches[0].pagey;

                Event.preventdefault ();

            },false);
    }
}

Touchscroll ("id");   The call requires an ID of Overflow:auto.

Invalid workaround for mobile Safari under Overflow:auto