leptos_use

Function use_mouse_in_element

Source 
pub fn use_mouse_in_element<El, M>(
    target: El,
) -> UseMouseInElementReturn<impl Fn() + Clone + Send + Sync>
where
    El: IntoElementMaybeSignal<Element, M>,
Expand description

Reactive mouse position related to an element.

§Demo

Link to Demo

§Usage

let target = NodeRef::<Div>::new();
let UseMouseInElementReturn { x, y, is_outside, .. } = use_mouse_in_element(target);

view! {
    <div node_ref=target>
        <h1>Hello world</h1>
    </div>
}

§SendWrapped Return

The returned closure stop is a sendwrapped function. It can only be called from the same thread that called use_mouse_in_element.

§Server-Side Rendering

On the server this returns simple Signals with the initial_value for x and y, no-op for stop, is_outside = true and 0.0 for the rest of the signals.