There are two ways to set up YASL.  
You can either collect multiple elements using jQuery or bind a single element to an individual YASL Stimulus controller.  
Both methods are explained with examples below.

Collect elements using a jQuery selector.

$('.elements-to-collect')
	.yasl(
		callbackEntryFunction,
		optionsObject
	)
	.startYasl();

For more information on available functions, see the "Functions" page.  
YASL automatically stops when the execCounter reaches 0 or when stopView() is called.

$('.elements-to-collect')
	.stopView();

The configuration can be updated by calling the function 'updateConfig'.

$('.elements-to-collect')
	.updateConfig( {threshold: 0.25, } );

To observe an element, add the attribute data-controller="yasl" to it.

<div
	data-controller="yasl"
	data-yasl-revert-value="true"
	data-yasl-animations-value="
		fade-move-in-turn-reveal-left-blur
	"
	data-yasl-animation-element-value="animationElement11"
	class="collect"
	style="
		--yasl-duration: 300ms;
		--yasl-delay: 100ms;
		--yasl-reveal: 70%;
		position: absolute;
		left: 50px;
		text-align: center;
		float: right;
	"
>

YASL can be fully configured using Stimulus value attributes.  
For detailed configuration options and usage instructions, visit the YASL Stimulus controller page.