In the jquery scrollView component https://docs.telerik.com/kendo-ui/api/javascript/ui/scrollview there is no current way to enableto 'endless' or 'wrap around' option like the react component has
ref: https://www.telerik.com/kendo-react-ui/components/scrollview/endless-scrolling/
Requesting that this feature be added.
For my SPECIFIC my use case (which will probably not work for everyone), I did add a workaround for now
(not fond of it as it relies on the implementation details of the current version)
In our SCSS, I added an override to force the previous/next buttons to always be visible, even after the control hides them
...
&.k-scrollview {
.k-scrollview-prev, .k-scrollview-next {
//Prevent the control from hiding these buttons when it reaches the 'end'
//We will be using some custom logic to force the 'wrap around'
display:flex !important;
...
Then I subscribed click events and did some manual handling on the buttons
//After the page load & scroll view is initialized... //note: $slides is a jquery instance that the scrollView is attached to let scrollView = $slides.data("kendoScrollView"); let $prev = $slides.find('.k-scrollview-prev'); let $next = $slides.find('.k-scrollview-next'); $prev.on("click", function (e) { // NOTE: Here we are looking at an 'internal' variable, this is dependent on the version of Kendo we are using - may need to change // in the future // I figured this out by looking at the implementation in the source // \src\js\kendo.scrollview.js let pageCount = scrollView._content.pageCount; let currentPage = scrollView._content.page; if (pageCount > 1 && currentPage === 0) { e.preventDefault(); e.stopPropagation(); scrollView.scrollTo(pageCount-1); } }); $next.on("click", function (e) { let pageCount = scrollView._content.pageCount; let currentPage = scrollView._content.page; if (pageCount > 1 && currentPage === pageCount - 1) { e.preventDefault(); e.stopPropagation(); scrollView.scrollTo(0); } });