Align touchcancel and pointercancel examples

Aligns touchcancel and pointercancel examples.
Adds a further example from iPhone 11 with 5 maxtouchpoints.
Reference the cancel events in the corresponding up events.

files/en-us/web/api/element/pointercancel_event/index.md

@@ -16,6 +16,7 @@ Some examples of situations that will trigger a `pointercancel` event:
 - The device's screen orientation is changed while the pointer is active.
 - The browser decides that the user started pointer input accidentally. This can happen if, for example, the hardware supports palm rejection to prevent a hand resting on the display while using a stylus from accidentally triggering events.
 - The {{cssxref("touch-action")}} CSS property prevents the input from continuing.
+- When the user interacted with too many simultaneous pointers the browser can fire this event for all existing pointers (even if they are still touching the screen).
 
 > **Note:** After the `pointercancel` event is fired, the browser will also send {{domxref("Element/pointerout_event", "pointerout")}} followed by {{domxref("Element/pointerleave_event", "pointerleave")}}.
 

files/en-us/web/api/element/pointerup_event/index.md

@@ -8,7 +8,7 @@ browser-compat: api.Element.pointerup_event
 
 {{APIRef}}
 
-The `pointerup` event is fired when a pointer is no longer active.
+The `pointerup` event is fired when a pointer is no longer active. Remember that it is possible to get a [`pointercancel`](/en-US/docs/Web/API/Element/pointercancel_event) event instead.
 
 ## Syntax
 

files/en-us/web/api/element/touchcancel_event/index.md

@@ -8,7 +8,15 @@ browser-compat: api.Element.touchcancel_event
 
 {{APIRef}}
 
-The `touchcancel` event is fired when one or more touch points have been disrupted in an implementation-specific manner (for example, too many touch points are created).
+The `touchcancel` event is fired when one or more touch points have been disrupted in an implementation-specific manner.
+
+Some examples of situations that will trigger a `touchcancel` event:
+
+- A hardware event occurs that cancels the touch activities. This may include, for example, the user switching applications using an application switcher interface or the "home" button on a mobile device.
+- The device's screen orientation is changed while the touch is active.
+- The browser decides that the user started touch input accidentally. This can happen if, for example, the hardware supports palm rejection to prevent a hand resting on the display while using a stylus from accidentally triggering events.
+- The {{cssxref("touch-action")}} CSS property prevents the input from continuing.
+- When the user interacted with too many simultaneous fingers the browser can fire this event for all existing pointers (even if they are still touching the screen).
 
 ## Syntax
 

files/en-us/web/api/element/touchend_event/index.md

@@ -8,7 +8,7 @@ browser-compat: api.Element.touchend_event
 
 {{APIRef}}
 
-The `touchend` event fires when one or more touch points are removed from the touch surface.
+The `touchend` event fires when one or more touch points are removed from the touch surface. Remember that it is possible to get a [`touchcancel`](/en-US/docs/Web/API/Element/touchcancel_event) event instead.
 
 ## Syntax