> ## Documentation Index > Fetch the complete documentation index at: https://mintlify.com/sveltejs/svelte/llms.txt > Use this file to discover all available pages before exploring further. # > Add event listeners and actions to the document body ```svelte theme={null} ``` Similarly to ``, this element allows you to add listeners to events on `document.body`, such as `mouseenter` and `mouseleave`, which don't fire on `window`. It also lets you use actions on the `` element. As with `` and ``, this element may only appear at the top level of your component and must never be inside a block or element. ## Event Listeners You can add any valid DOM event listener that works on the body element: ```svelte theme={null} ``` ### Common body events * `onmouseenter` - Mouse enters the body * `onmouseleave` - Mouse leaves the body * `onmousemove` - Mouse moves over body * `onclick` - Click on body * `ontouchstart` - Touch starts on body * `ontouchend` - Touch ends on body ## Actions You can use Svelte actions on the body element: ```svelte theme={null} ``` ## Usage ### Detect mouse leaving window ```svelte theme={null} mouseInWindow = true} onmouseleave={() => mouseInWindow = false} /> {#if !mouseInWindow}
Come back!
{/if} ``` ### Track global mouse position ```svelte theme={null}

Mouse position: {x}, {y}

``` ### Using multiple actions ```svelte theme={null} ``` ### Click outside detection ```svelte theme={null} {#if isOpen}
Modal content
{/if} ``` ### Combine events and actions ```svelte theme={null} ```