
- HTML Tutorial
- HTML - Home
- HTML - Overview
- HTML - Basic Tags
- HTML - Elements
- HTML - Attributes
- HTML - Formatting
- HTML - Phrase Tags
- HTML - Meta Tags
- HTML - Comments
- HTML - Images
- HTML - Tables
- HTML - Lists
- HTML - Text Links
- HTML - Image Links
- HTML - Email Links
- HTML - Frames
- HTML - Iframes
- HTML - Blocks
- HTML - Backgrounds
- HTML - Colors
- HTML - Fonts
- HTML - Forms
- HTML - Embed Multimedia
- HTML - Marquees
- HTML - Header
- HTML - Style Sheet
- HTML - Javascript
- HTML - Layouts
- HTML References
- HTML - Tags Reference
- HTML - Attributes Reference
- HTML - Events Reference
- HTML - Fonts Reference
- HTML - ASCII Codes
- ASCII Table Lookup
- HTML - Color Names
- HTML - Entities
- HTML - Fonts Ref
- HTML - Events Ref
- MIME Media Types
- HTML - URL Encoding
- Language ISO Codes
- HTML - Character Encodings
- HTML - Deprecated Tags
Pull down to refresh on the mobile web browser in HTML.
When there is a requirement to pull down the screen to refresh the page to get latest updates, this can be done with the help of JavaScript, xhttprequests and then touch events.
Pull refresh is a trigger to XHR in AJAX .It adds new data to the element we want.
Pull refresh can be implemented with the help of hijacked JavaScript scrolling mechanism like iscroll. Twitter is using iscroll to pull refresh option.
Another way is to create a refresh handler for overflow:scroll components.
The interface provided can give an idea about the handler interface −
var PullToRefresh= function(callback, wrapper, instructionsText) { //It creates dom elements and append them before content wrapper // <div class="mainWrapper" style="overflow: scroll; height: 600px;"> <div class="pullToReloadWrapper"></div><div class = "contentWrapper"></div> </div> is the markup. // if main wrapper's height is > than content wrapper's height, then change the main wrapper height to be the height of the content wrapper. // scroll main wrapper. // invoke initializeEvents() to inititalize the events };
- Related Articles
- Disabling Pull-to-Refresh Feature on Mobile Browsers using CSS
- Disabling Android's chrome pull-down-to-refresh feature with HTML.
- How to implement Android Pull-to-Refresh?
- The Mobile Web
- Get maximal GPS precision on mobile browser
- How to manage parental control on YouTube kids web browser?
- Difference between Web Browser and Web Server.
- How to Automatic Refresh a web page in a fixed time?
- How can I turn on error information in my Web Browser?
- JavaScript Detecting a mobile browser
- How to check web browser support in HTML5
- How to perform back and refresh in a browser in Selenium with python?
- Convenient Web-browser controller in Python
- Optimizing SVG-based sprite-sheets for CSS3 HW GPU acceleration in the mobile browser with HTML
- Creating SAP interface to pull data from web application

Advertisements