From 1407c8fdef01ecd0ffb8a8bd46e7113f119b9fde Mon Sep 17 00:00:00 2001 From: julieng Date: Sat, 2 Oct 2021 17:20:24 +0200 Subject: convert content to md --- files/fr/web/api/document/scroll_event/index.md | 161 ++++++++++-------------- 1 file changed, 66 insertions(+), 95 deletions(-) (limited to 'files/fr/web/api/document/scroll_event') diff --git a/files/fr/web/api/document/scroll_event/index.md b/files/fr/web/api/document/scroll_event/index.md index 21c5ba592e..47a92ef23c 100644 --- a/files/fr/web/api/document/scroll_event/index.md +++ b/files/fr/web/api/document/scroll_event/index.md @@ -9,94 +9,66 @@ tags: - requestAnimationFrame translation_of: Web/API/Document/scroll_event --- -
{{APIRef}}
+{{APIRef}} -

L’évènement scroll (défilement) est émis lorsque l’on fait défiler le document ou un élément.

+L’évènement **`scroll`** (défilement) est émis lorsque l’on fait défiler le document ou un élément. -

Informations générales

+## Informations générales - - - - - - - - - - - - - - - - - - - - - - + + + + + + + + + + + + + + + + + + + + + +
BouillonnePas sur les éléments, mais bouillonne vers la defaultView si émis sur le document
AnnulableNon
Interface{{domxref("UIEvent")}}
CibleDefaultView, {{domxref("Document")}}, {{domxref("Element")}}
Action par défautAucune
Bouillonne + Pas sur les éléments, mais bouillonne vers la defaultView si émis sur le + document +
AnnulableNon
Interface{{domxref("UIEvent")}}
Cible + DefaultView, {{domxref("Document")}}, + {{domxref("Element")}} +
Action par défautAucune
-
-

Note : Sur iOS UIWebViews, les évènements scroll ne sont pas émis pendant le défilement, mais une fois que celui-ci est terminé. Voir Bootstrap issue #16202. Safari et WKWebViews ne sont pas affectés par ce bogue.

-
+> **Note :** Sur iOS UIWebViews, les évènements `scroll` ne sont pas émis pendant le défilement, mais une fois que celui-ci est terminé. Voir [Bootstrap issue #16202](https://github.com/twbs/bootstrap/issues/16202). Safari et WKWebViews ne sont pas affectés par ce bogue. -

Propriétés

+## Propriétés - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -
PropriétéTypeDescription
target {{readonlyInline}}{{domxref("EventTarget")}}La cible de l’évènement (la plus haute dans l’arbre DOM).
type {{readonlyInline}}{{domxref("DOMString")}}Le type d’évènement.
bubbles {{readonlyInline}}{{domxref("Boolean")}}Si l’évènement bouillonne ou non.
cancelable {{readonlyInline}}{{domxref("Boolean")}}Si l’évènement est annulable ou non.
view {{readonlyInline}}{{domxref("WindowProxy")}}{{domxref("Document.defaultView")}} (objet window du document)
detail {{readonlyInline}}long (float)0.
+| Propriété | Type | Description | +| ------------------------------------- | ------------------------------------ | ----------------------------------------------------------------------------- | +| `target` {{readonlyInline}} | {{domxref("EventTarget")}} | La cible de l’évènement (la plus haute dans l’arbre DOM). | +| `type` {{readonlyInline}} | {{domxref("DOMString")}} | Le type d’évènement. | +| `bubbles` {{readonlyInline}} | {{domxref("Boolean")}} | Si l’évènement bouillonne ou non. | +| `cancelable` {{readonlyInline}} | {{domxref("Boolean")}} | Si l’évènement est annulable ou non. | +| `view` {{readonlyInline}} | {{domxref("WindowProxy")}} | {{domxref("Document.defaultView")}} (objet `window` du document) | +| `detail` {{readonlyInline}} | `long` (`float`) | 0. | -

Exemple

+## Exemple -

Temporisation des évènements scroll

+### Temporisation des évènements scroll -

Comme les évènements scroll peuvent être émis à une fréquence élevée, le gestionnaire d’évènements ne devrait pas effectuer des opérations coûteuses en termes de puissance de calcul, telles que des modification du DOM. À la place, il est recommandé de temporiser l’évènement en utilisant {{domxref("window.requestAnimationFrame()", "requestAnimationFrame()")}}, {{domxref("window.setTimeout()", "setTimeout()")}} ou un {{domxref("CustomEvent")}}, comme suit.

+Comme les évènements `scroll` peuvent être émis à une fréquence élevée, le gestionnaire d’évènements ne devrait pas effectuer des opérations coûteuses en termes de puissance de calcul, telles que des modification du DOM. À la place, il est recommandé de temporiser l’évènement en utilisant {{domxref("window.requestAnimationFrame()", "requestAnimationFrame()")}}, {{domxref("window.setTimeout()", "setTimeout()")}} ou un {{domxref("CustomEvent")}}, comme suit. -

Notez, cependant, que les évènements d’interface utilisateur et les frames d’animation sont émises à peu près à la même fréquence, et ainsi l’optimisation qui suit est souvent superflue. Cet exemple optimise l’évènement scroll avec requestAnimationFrame.

+Notez, cependant, que les évènements d’interface utilisateur et les frames d’animation sont émises à peu près à la même fréquence, et ainsi l’optimisation qui suit est souvent superflue. Cet exemple optimise l’évènement `scroll` avec `requestAnimationFrame`. -
// Référence: http://www.html5rocks.com/en/tutorials/speed/animations/
+```js
+// Référence: http://www.html5rocks.com/en/tutorials/speed/animations/
 
 var derniere_position_de_scroll_connue = 0;
 var ticking = false;
@@ -116,33 +88,32 @@ window.addEventListener('scroll', function(e) {
   }
 
   ticking = true;
-});
+}); +``` -

Autres exemples

+### Autres exemples -

Pour plus d’exemples similaires, voir l’évènement resize.

+Pour plus d’exemples similaires, voir l’évènement [resize](/en-US/docs/Web/Events/resize#Example). -

Spécifications

+## Spécifications - - - - - - - - - - + + + + + + + + + +
SpécificationÉtat
{{SpecName('CSSOM View', '#scrolling-events')}}{{Spec2('CSSOM View')}}
SpécificationÉtat
{{SpecName('CSSOM View', '#scrolling-events')}}{{Spec2('CSSOM View')}}
-

Compatibilité des navigateurs

+## Compatibilité des navigateurs -

{{Compat("api.Document.scroll_event")}}

+{{Compat("api.Document.scroll_event")}} -

Voir aussi

+## Voir aussi - +- {{domxref("GlobalEventHandlers.onscroll")}} -- cgit v1.2.3-54-g00ecf