[JS] Scroll

Scroll smoothly to an element

Index

• $.fn.scrollTo - basic scroll function
• $.fn.scrollAnchor - define an element as scroll anchor
• data variation (HTML) - scroller in html

$.fn.scrollTo

The basic function. Select the Target by an jQuery-Object

$( '.mytarget' ).scrollto({
	speed: 1000,
	easing: 'swing',
	onScrollStart: function () {
		alert( 'started scrolling' );
	},
	onScrollEnd: function () {
		alert( 'finished scrolling' );
	}
});

Options

speed (int)
Optional. Duration of scrolling
Default: 1000

easing (string)
Optional. Scroll effect
Default: Swing

onScrollStart (function)
Optional. Callback function, called when scrolling starts

onScrollEnd (function)
Optional. Callback function, called when scrolling finished

$.fn.scrollAnchor

Active smooth scroll by click on all links with <a href="#..."></a>

$( 'a[href^="#"]' ).scrollAnchor({
	speed: 500
});

Options

see Options of the basic function

data variation (HTML)

<a data-scroll-target="#mytarget" data-scroll-speed="800" data-scroll-easing="linear"></a>

Attributes

data-scroll-target (jquery/css selector)
The target scroll element

data-scroll-speed (int)
Optional. Duration of scrolling

data-scroll-easing (string)
Optional. Scroll effect