Maison >interface Web >tutoriel HTML >Déroulez pour actualiser dans les navigateurs Web mobiles en HTML

Déroulez pour actualiser dans les navigateurs Web mobiles en HTML

PHPz
PHPzavant
2023-09-06 08:01:111287parcourir

Déroulez pour actualiser dans les navigateurs Web mobiles en HTML

Lorsque vous devez dérouler l'écran pour actualiser la page afin d'obtenir les dernières mises à jour, vous pouvez le faire à l'aide de JavaScript, de xhttprequests et d'événements tactiles.

Pull-to-refresh est le déclencheur de XHR en AJAX. Il ajoute de nouvelles données à l'élément souhaité.

Pull-to-refresh peut être réalisé en détournant le mécanisme de défilement JavaScript (tel que iscroll). Twitter utilise iscroll pour implémenter l'option d'actualisation déroulante.

Une autre façon consiste à créer un gestionnaire d'actualisation pour le composant overflow:scroll.

L'interface fournie peut donner une idée de l'interface du gestionnaire −

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&#39;s height is > than content wrapper&#39;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
};

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer