---
title: "How to Add a Scroll on Hover to an Image in WordPress?"
url: https://nexterwp.com/docs/add-a-scroll-on-hover-to-an-image-in-wordpress/
date: 2024-12-09
modified: 2026-04-14
author: "Aditya Sharma"
description: "Would you like to make your WordPress images scroll smoothly? This feature is great for displaying long portfolio images, allowing them to fit neatly into smaller sections of your website...."
image: https://nexterwp.com/wp-content/uploads/2024/12/How-to-Add-a-Scroll-on-Hover-to-an-Image-in-WordPress_-1024x519.jpg
word_count: 195
---

# How to Add a Scroll on Hover to an Image in WordPress?

## Key Takeaways

- Nexter Blocks Advanced Image block adds a scrolling effect on hover to a WordPress image.
- Scrolling Image toggle in the Special Options tab enables the effect after an image is added in the Upload Image section.
- Min Height must be smaller than the original image height, and Transition Duration adjusts the scrolling speed.

Would you like to make your WordPress images scroll smoothly? This feature is great for displaying long portfolio images, allowing them to fit neatly into smaller sections of your website. Adding a scrolling effect to images can make your design more dynamic and catch the attention of your audience. 

With the Advanced Image block from Nexter Blocks, you can easily add a scrolling effect on hover to your image in WordPress.

*To check the complete feature overview documentation of the Nexter Blocks Advanced Image block, [click here](https://nexterwp.com/docs/add-advanced-effects-to-an-image-in-wordpress/).*

***Requirement  - This block is a part of the Nexter Blocks, make sure it's installed & activated to enjoy all its powers.***

[LIVE BLOCK LINK](https://nexterwp.com/nexter-blocks/blocks/wordpress-advanced-image/)

To do this, add the Advanced Image block to the page and follow the steps -

1. Add your image in the **Upload Image** section.

2. Then enable the **Scrolling Image** toggle from the **Special Options** tab.

3. In the **Min Height** section, you have to set the image height, it should be smaller than the original image height.

Then you can adjust the scrolling speed from the **Transition Duration** field. 

Now, you’ll see a scrolling effect as you hover on the image.