Select Page

How can we help you today?

Categories
← Back
Print

Image Rotator

The Divi PIxel Image Rotator is a user-friendly Divi module that simplifies creating and customizing stunning 360 images. With its intuitive interface, you can easily leverage the built-in features to enhance your 360 image experience. Add playback controls, enable autoplay functionality for an immersive viewing experience, and empower users to interact with the image by rotating it using either mouse scroll or drag.

View Demo →

Content

The Image Rotator enables users to upload images captured from various perspectives and provides intuitive controls for rotating them using mouse drag or scroll.

Images

To begin using the Image Rotator module, navigate to the Content → Images toggle and upload your desired images. Within this section, you can also conveniently specify the image order. This feature proves particularly beneficial when uploading multiple images, as it eliminates the need for manual sorting to achieve a seamless rotation animation.

Moreover, the Image Rotator module offers the option of Responsive Thumbnails. By utilizing this feature, you can serve optimized thumbnail images specifically tailored for different devices. This approach greatly enhances performance on tablets and mobiles, ensuring a smoother and more efficient user experience.

Settings

In the Content → Settings section, you can customize the rotation effect and user interaction within the Image Rotator module. The Autoplay function, for instance, initiates the animation automatically upon page load and continues to play indefinitely. You can further refine the Autoplay Speed by adjusting the control, with lower values resulting in faster rotation animation. Additionally, the Invert Play option allows you to reverse the direction of the rotation, adding an extra dimension of customization.

The Image Rotator module provides two primary methods for user interaction. Users can either scroll through the images by dragging or scrolling the mouse. The Rotate on Drag option, in particular, offers two directional possibilities: Horizontal and Vertical. Alternatively, users can rotate the image by simply scrolling with their mouse when the Rotate On Scroll option is enabled. This versatile set of interaction options enhances the usability and user experience of the module.

Play/Pause Buttons

With the Image Rotator module, you can incorporate playback controls to enhance user interaction. This feature allows users to gain control over the rotation animation through intuitive play and pause buttons. Moreover, you can customize these buttons to suit your specific needs. Not only can you edit the button texts, but you also have the flexibility to adjust the buttons’ horizontal alignment and vertical position, ensuring they seamlessly integrate with your desired design.

You can explore the Design tab within the module settings for even more extensive customization options. Here, you can delve into further refinements to tailor the appearance and style of playback buttons to align perfectly with your website or application.

Design

Alongside the standard customization options provided in Divi modules, the Image Rotator module offers two additional tabs dedicated to styling the Play and Pause buttons. To achieve the desired customization, navigate to the Design → Play Button and Design → Pause Button sections.

In the Design → Play Button tab, you can personalize the appearance of the Play button, ensuring it aligns harmoniously with your overall design scheme. Similarly, in the Design → Pause Button toggle, you can customize the Pause button, tailoring its visual attributes to suit your preferences.

Previous Image Mask
Next Image Showcase
Table of Contents