How to Create Image Scroll Animations like in Apple, Sony in Elementor?

Updated onApril 11, 2026By

Key Takeaways

  • The Plus Addons for Elementor Scroll Sequence widget allows users to create professional Image Scroll Animations without coding.
  • Users can choose between Gallery and Remote Server upload types based on the number of images for the animation.
  • The Preload Image (%) option in the Extra Options tab lets users select how many images load initially from their image sequence.
Table Of Content

Are you looking to create professional Image Scroll Animations like Apple, Sony on your Elementor website? Image Scroll Animations not only add a touch of creativity but also help to keep your visitors engaged and increase their dwell time on your website. If you’ve ever seen the seamless image scroll animations on Apple and Sony websites, you know exactly how effective this design element can be.

To check the complete feature overview documentation of The Plus Addons for Elementor Scroll Sequence widget, click here.

Requirement  – This widget is a part of The Plus Addons for Elementor, make sure it’s installed & activated to enjoy all its powers.

LIVE WIDGET LINK

With the Scroll Sequence widget from The Plus Addons for Elementor, you can create professional looking Image Scroll Animations without any coding.

To do this first you have to create an animation that represents your brand. Once you have the animation video then you have to convert that into multiple image files which you can use to create the image scroll animation.

Learn how to convert video into image files.

Now once you have the image sequence files, add a section or container (for flexbox), then add the Scroll Sequence widget there.

Select the appropriate option from the Apply To dropdown where you want to add the sequence animation.

Then from the Upload Type you can choose Gallery if you have a small number of images but if you have lots of images then you should select Remote Server.

Learn how to use the Remote Server for scroll sequence animation.

So based on your choice, upload your image sequence files in the appropriate location.

Then from the Extra Options tab, using the Preload Image (%), you can choose the number of images that will load at first from your image sequence.

Now if you want to use some content with your image scrolling animation as you see on those popular sites, for that you have two options.

You can use Sticky Sections, which will allow you to animate your content along with the scrolling animation. You can learn more about the process.

Or you can simply add different widgets in the same section or container (for flexbox) which has the Scroll Sequence widget, this will allow the content to scroll as the image scroll animation plays.

Scroll sequence content stracture

This is how the animation would look.

So this is how you can create professional looking image scrolling animation using the Scroll Sequence widget.

About the Author

Photo of Aditya Sharma CMO of The Plus Addons for Elementor
CMO · The Plus Addons for Elementor · 10 years experience

He has spent years in the WordPress ecosystem building, breaking, and optimizing sites until they actually perform. He works at the intersection of speed, growth, and usability, helping creators ship websites that load fast and convert. An active WordPress community contributor sharing through tools, tutorials, and direct collaboration. Tested practice, not theory.

WordPressElementorn8nAIClaudeAutomationServer
LinkedIn X GitHub YouTube Website
Get Instant Answers to all your questions about The Plus Addons for Elementor, trained on 1000+ Docs and Videos

Related Frequently Asked Questions

What should I do if my image scroll animation isn't displaying correctly?

If your image scroll animation isn't showing as expected, first ensure that the Scroll Sequence widget from The Plus Addons for Elementor is properly installed and activated. Check the image sequence files you uploaded; they should be in the correct format and uploaded to the right location. If you're using a Remote Server, ensure the server is accessible and the images are properly linked. A common issue is not preloading enough images, so adjust the Preload Image (%) setting in the Extra Options tab.

What is the best way to upload my image sequence files for the scroll animation?

For optimal performance when using the Scroll Sequence widget, choose the Upload Type based on the number of images. If you have a small number of images, select Gallery; for larger sets, opt for Remote Server. This ensures efficient loading and smooth animation. Remember to upload your images in the correct order to maintain the intended sequence.

Are there any limitations when using the Scroll Sequence widget?

One limitation to consider is that the Scroll Sequence widget requires The Plus Addons for Elementor to function, meaning it won't work with other page builders like Gutenberg or Divi. Additionally, if you have a large number of images, loading times may increase, potentially affecting performance. It's essential to balance image quality and file size to optimize loading speeds.

How can I add content alongside my image scroll animation?

To incorporate content with your image scroll animation, you can use Sticky Sections, which will allow the content to animate in sync with the scrolling images. Alternatively, you can add different widgets within the same section or container as the Scroll Sequence widget. This flexibility enables you to create a more engaging experience for visitors by combining visuals and text.

Last reviewed: April 11, 2026

Related Docs