
move the slide container along with the movement of the finger funciton called when touch move event is fired i.e finger is dragged over the screen tTimeout(function(), 10) Įvent.preventDefault() //prevents the window from scrolling. scroll the window up to hide the address bar of the browser.

MaxDistance: 0, //maximum distance in X direction that slide container can moveĬurrentDistance: 0, //current distance moved by slide container through translate IsTouchStart: false, //boolen to chk whether touch has started TimerCounter: 0, //counter variable for timer Timer: null, //timer that set starts when touch starts PreferredHeight: 0, //dynamic variable to set height PreferredWidth: 0, //dynamic variable to set width StartX: 0, //registers the initial touch co-ordinate Slides: null, //array of all slides i.e elementsĭistanceX: 0, //distance moved in X direction i.e left or right Wrapper: null, //meant for masking/clipping SlideContainer: null, // element object that holds the image slides webkit-transition: -webkit-transform 0.3s linear
#Html optimizer for screen resolution code
I'll post his code below so you don't have to go there to see it. It seems like it is hard coded to work at iPhone size, but when displayed on an iPad it takes up a small portion of the screen. My issue is I can't get the images and it as a whole to fit whichever screen it is on.


Mainly just the ability to swipe to flip pages just like that link shows. It supposed to be an HTML5 app that can be displayed on Android, iPhone, and iPad. I used this site to get kind of what I'm going for Here. So I would really appreciate any assistance. I understand basics, but I need what I am making in HTML 5. I've been looking around for a solution to this with very little luck.
