Magnetic Scroll View

Magnetic Scroll View is a Scroll View System that allows the user to scroll panels by swiping using touch or mouse input.

There are four Snap Modes, these are: Swipe Mode - In this mode, the users just need to Swipe in one of four directions (UP, DOWN, RIGHT, LEFT), then the next/previous panel will snap to the center. Snap To Nearest - This will make the closest panel to snap on the center after dragging them. Both - Work the same way as Swipe mode, but when the swipe is cancelled, the nearest element will snap on the center. None - This mode allows the user to drag the panels freely.

You can easily choose some settings, according to yours needs: Fit the panel size to the viewport or configure the size by yourself. Set it to align vertically or horizontally. Change Layout mode (Circular or Linear). Circular factor to defines how circular the elements will be positioned. Set up paddings between panels. Add limits to the extremities. Invert the elements order of alignment. Add margin between element and viewport. Enable infinite scrolling that allows to scroll infinitely, going from first to last element and vice versa (Circular Layout Mode only). Transition speed. Slows down the dragging speed. Min and Max Swipe time. Add the Swipe events you need. Use Buttons. Show Index Table. Mask viewport. Show viewport mask image.