> For the complete documentation index, see [llms.txt](https://bricksmotion.gitbook.io/bricksmotion-components/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://bricksmotion.gitbook.io/bricksmotion-components/components/scroll-scenes/scroll-scene-2.md).

# Scroll Scene #2

### Component Structure

* **COPY WRAPPER (div)**: Establishes the foundation for Scroll Scene #2, encapsulating all subsequent elements.
* **SC2 COMPONENT (block)**: This primary container, styled with `.sc2__component`, sets the scene for the interactive scroll experience by defining the viewport height, content alignment, and managing overflow.
* **SC2 WRAPPER (block)**: At the heart of the component's design, this wrapper, identified by `.sc2__wrapper`, aligns and justifies the content centrally with an applied rotation, offering a unique visual arrangement.
* **SC2 IMAGE WRAPPERS (blocks)**: Multiple wrappers such as `.sc2__img-wrapper`, organize the images in a row format, enabling a staggered animation effect upon scrolling. These elements bring to life the geometric layout through varied directional animations, enhancing the depth and engagement of the scene.
* **SC2 IMAGES (images)**: Placed within the image wrappers, these images, marked by `.sc2__img`, are set for eager loading, ensuring immediate visibility. Their responsive scaling across devices maintains the visual integrity of the component.

### Animation Structure

**SC2 - Scroll**: This animation sequence, initiated upon scrolling, meticulously arranges the movement of images to complement the component's geometric aesthetics.

* **Odd Image Wrappers**: Images from odd-numbered wrappers transition from the screen's center to the left, employing a dynamic visual draw that captivates the viewer's attention.
* **Even Image Wrappers**: Conversely, images from even-numbered wrappers move from the right towards the center, establishing a visual balance and sustaining user interest through the scroll.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter, and the optional `goal` query parameter:

```
GET https://bricksmotion.gitbook.io/bricksmotion-components/components/scroll-scenes/scroll-scene-2.md?ask=<question>&goal=<endgoal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is optional and describes the broader end goal you are ultimately trying to accomplish on behalf of the user. GitBook uses it to tailor the answer towards what is most useful for that goal.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.