---
title: "How to Add Scroll Top Animation in Elementor Accordion?"
url: https://theplusaddons.com/docs/scroll-top-animation-in-elementor-accordion/
date: 2023-04-28
modified: 2026-04-11
author: "Aditya Sharma"
description: "Adding scroll top animation to the Elementor accordion, users can click on an accordion item and have it smoothly scroll to the top of the page, ensuring that the content..."
image: https://theplusaddons.com/wp-content/uploads/2023/04/How-to-Add-Scroll-Top-Animation-in-Elementor-Accordion_-1024x536.jpg
word_count: 173
---

# How to Add Scroll Top Animation in Elementor Accordion?

## Key Takeaways

- The Plus Addons for Elementor's Accordion widget allows users to add scroll top animation.
- Users can specify the offset distance for scrolling in the Offset field of the Accordion widget.
- The Speed field in the Accordion widget enables users to set the scroll animation speed.

Adding scroll top animation to the Elementor accordion, users can click on an accordion item and have it smoothly scroll to the top of the page, ensuring that the content is in full view. This feature is particularly useful for longer accordion items or when there are multiple accordion items on a page. 

You can easily add scroll top animation to your Elementor accordion using The Plus Addons for Elementor's Accordion widget.

*To check the complete feature overview documentation of The Plus Addons for Elementor Accordion widget, [click here](/docs/elementor-accordion-widget-settings-overview/).*

***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](https://theplusaddons.com/elementor-widget/elementor-accordion/?utm_source=tpae&utm_medium=docs&utm_campaign=text)

To do this, add the widget on the page, then go to the **Extra Option** tab and turn on the **Scroll Top** toggle. 

![](https://theplusaddons.com/wp-content/uploads/2023/04/Tpae-Accordion-Scroll-Top-3.png)

Then, in the **Offset** field, you can specify the amount of space from the top of the page until the active accordion item scrolls. 

In the **Speed** field, you can set scroll animation speed. 

![accordion scroll top demo](https://theplusaddons.com/wp-content/uploads/2023/04/accordion-scroll-top-demo.gif)

## Frequently Asked Questions

**Q: What should I do if the scroll top animation isn't working in my Elementor accordion?**
A: If the scroll top animation isn't functioning, ensure that you have activated the Scroll Top toggle in the Extra Option tab of the Accordion widget. If it's still not working, check that The Plus Addons for Elementor is properly installed and activated, as this feature relies on the plugin. Sometimes, conflicts with other plugins can also cause issues, so consider disabling them temporarily to troubleshoot.

**Q: What is the best speed setting for scroll top animation in an Elementor accordion?**
A: The best speed setting for scroll top animation depends on your site's design and user experience goals. A common practice is to set the speed between 300 to 500 milliseconds for a smooth transition. This range is fast enough to feel responsive but slow enough to allow users to perceive the scroll. Adjust the Speed field in the Accordion widget settings to find what feels right for your specific layout.

**Q: Does the scroll top animation work on mobile devices?**
A: The scroll top animation in the Elementor accordion is designed to work on all devices, including mobile. However, it's important to test the functionality on various screen sizes to ensure the user experience remains smooth. Mobile users may have different scrolling behaviors, so verifying that the animation performs well on mobile is crucial for maintaining usability.

**Q: How do I add the scroll top animation to my Elementor accordion?**
A: To add scroll top animation to your Elementor accordion, first, ensure you have The Plus Addons for Elementor installed. Then, add the Accordion widget to your page, navigate to the Extra Option tab, and turn on the Scroll Top toggle. You can also specify the offset and speed settings to customize the animation to fit your design needs.