javascript - how can make scrollable divs or tables for mobile devices? -

i in web dev past 2 years or so. never had deal mobile. lately required develop responsive templates wordpress. managed many things working except tables.

my idea responsive table solution putting table's content inside div has overflow:auto. datatable fixed columns

i've worked on past few hours thinking scrolling on mobiles browsers same computer browsers. check mobiles see if works(gallaxy note/tablet- worked fine, iphone 4 s/ iphone 5 - didnt work). here fiddle worked on jsfiddle

after realized normal jquery scroll() wont work started reading jquery mobile found following:

element.on("scrollstart",function(){     console.log("happening"); }); 

i tried , still nothing.

my question how handle scrolling on mobile browsers? , how should approach developing mobiles ? guide ?article ?

thanks

i've read more , tried different things none of stable or working on several different mobiles.

the reason thought scrollstart doesnt work because works different .scroll().

.scroll() event fires every step of scrolling giving better indication of whats going on whereas scrollstart fires 1 time when start scrolling , scrollstop fires when stop scrolling , seem works fine on iphone , android devices.

however when using start/stop there's still gap cant account for. thought of 2 solutions that:

1. at scrollstart start interval runs fast possible , fire event or perform action - in case update header's left scroll , @ scrollstop kill interval.

2. at scrollstart bind document mousemove , perform action like. @ scrollstop unbind mousemove.

i think number 1 should work more reliably heavier / require more resources.

var interval = ""; $('.element').on("scrollstart",function(){     if(!interval){         interval = setinterval(function(){             //* fires event             console.log($('.element').scrollleft());         }, 0);     } }).on("scrollstop",function(){     console.log($('.element').scrollleft());     clearinterval(interval);     interval = false; }); 

hope helps whoever had problem.