Skip to main content

use_element_bounding

leptos_use

Function use_element_bounding 

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

Reactive bounding box of an HTML element

§Demo

Link to Demo

§Usage

let el = NodeRef::<Div>::new();
let UseElementBoundingReturn {
    x, y, top,right,bottom,left, width, height, ..
} = use_element_bounding(el);

view! { <div node_ref=el></div> }

§SendWrapped Return

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

§Server-Side Rendering

Make sure you follow the instructions in Server-Side Rendering.

On the server the returned signals always are 0.0 and update is a no-op.