# Sliding / Scrolling Animation with Infinite Items

**URL:** <https://forum.kirupa.com/t/sliding-scrolling-animation-with-infinite-items/639250>\
**Category:** programming\
**Created:** [January 9, 2019, 5:30am UTC](https://forum.kirupa.com/t/sliding-scrolling-animation-with-infinite-items/639250 "2019-01-09T05:30:14Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [January 9, 2019, 5:30am UTC](https://forum.kirupa.com/t/sliding-scrolling-animation-with-infinite-items/639250/1 "2019-01-09T05:30:14Z")

</div>

by [kirupa](https://www.kirupa.com/www.kirupa.com/me/index.htm) | 14 May 2018

A fun effect that adds a little bit of quirkiness to your page is a sliding (or scrolling) animation that looks as follows:

* * *
This is a companion discussion topic for the original entry at [https://www.kirupa.com/animations/infinite\_sliding\_animation.htm](https://www.kirupa.com/animations/infinite_sliding_animation.htm)

---

<div class="post-metadata">

**Author:** ![prg9](https://avatars.discourse-cdn.com/v4/letter/p/8dc957/32.png) [@prg9](https://forum.kirupa.com/u/prg9)\
**Post date:** [January 9, 2019, 2:07pm UTC](https://forum.kirupa.com/t/sliding-scrolling-animation-with-infinite-items/639250/2 "2019-01-09T14:07:46Z")

</div>

Yes fun, but I wouldn’t necessarily categorize it as **quirky**. The “overflow:hidden;” technique is widely used for a myriad of nice effects when coupled with CSS / JS animations. Between it and various clip/path techniques web peeps can create some really engaging and immersive experiences (Flash-esque). You could probably do an entire tutorial series concerning these effect methods of animation techniques and approaches. I do see some relative existing ones that are in the tutorials you’ve already made. 😉

---

<div class="post-metadata">

**Author:** ![kirupa](https://yyz1.discourse-cdn.com/flex011/user_avatar/forum.kirupa.com/kirupa/32/11616_2.png) [@kirupa](https://forum.kirupa.com/u/kirupa)\
**Post date:** [January 10, 2019, 5:04am UTC](https://forum.kirupa.com/t/sliding-scrolling-animation-with-infinite-items/639250/3 "2019-01-10T05:04:50Z")

</div>

Removed the quirkiness phrasing haha. Totally agree.

I forgot that the forums get an auto-post of even **_in progress_** tutorials if I accidentally preview in the browser. It is a boring long story for why that is. Anyway, I finished the tutorial just a few moments ago, and I did make some big edits since you may have last seen it 😛