راه‌ اندازی

برای شروع استفاده از کتابخانه ابتدا می‌بایست فایل ScrollSpy.js را در سند خود درج کنید و درصورت تمایل (نه‌لزوما) فایل ScrollSpy.css را نیز برای استایل‌دهی پیش‌فرض درج نمایید که در نهایت باید به شکل زیر باشد :

<link rel="stylesheet" href="ScrollSpy.min.css">
<script src="ScrollSpy.min.js"></script>

سپس به عناصری که باید دنبال شوند، کلاسی مانندscrollspy نسبت می‌دهیم :

<div class="scrollspy" spy-title="Section Title">Content</div>
<div class="scrollspy" spy-title="عنوان بخش">Content</div>
<div class="scrollspy" spy-title="عنوان بخش">Content</div>
<div class="scrollspy" spy-title="عنوان بخش">Content</div>
<div class="scrollspy" spy-title="عنوان بخش">Content</div>
<div class="scrollspy" spy-title="عنوان بخش">Content</div>

سپس درصورت تمایل (نه‌لزوما) به یک المنت با آیدی scrollspy-indicator مشخصه اندیکاتور می‌دهیم :

// Initializing the ScrollSpy to the elements with class of 'scrollspy'
var spy = new ScrollSpy({
    contexts_class: 'scrollspy'
});

// Initializing the Indicator inside the element with ID of 'scrollspy-indicator'
spy.Indicator({
    element: document.getElementById('scrollspy-indicator'),
    indicator_container_class: "indicator",
    indicator_item_class: "item-indicator",
    clickable: false,
    forceActive: true
});

برای شخصی‌سازی ها و دسترسی های بیشتر می‌توانید مستندات را مطالعه کنید.