leptos_use

Function use_mouse_in_element

Source
pub fn use_mouse_in_element<El, T>(
    target: El,
) -> UseMouseInElementReturn<impl Fn() + Clone>
where El: Into<ElementMaybeSignal<T, Element>> + Clone, T: Into<Element> + Clone + 'static,
Expand description

Reactive mouse position related to an element.

§Demo

Link to Demo

§Usage

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

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

§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.