Function leptos_use::use_draggable

source ·
pub fn use_draggable<El, T>(target: El) -> UseDraggableReturn
where El: Into<ElementMaybeSignal<T, EventTarget>>, T: Into<EventTarget> + Clone + 'static,
Expand description

Make elements draggable.

§Demo

Link to Demo

§Usage

let el = create_node_ref::<Div>();

// `style` is a helper string "left: {x}px; top: {y}px;"
let UseDraggableReturn {
    x,
    y,
    style,
    ..
} = use_draggable_with_options(
    el,
    UseDraggableOptions::default().initial_value(Position { x: 40.0, y: 40.0 }),
);

view! {
    <div node_ref=el style=move || format!("position: fixed; {}", style.get())>
        Drag me! I am at { x }, { y }
    </div>
}