1. Home
  2. Features
  3. Animation Effects
  4. Animation On Group Hover
  5. Element Shift On Group Hover

How To Shift Elements Horizontally On Group Or Grid Cell Hover

Shifting an Element on Hover is a natural effect since you create a reaction on a mouse hovering a Group imitating any commonly known moving things. In the Property Panel to the right, the Hover On Group Panel, you can choose the Shift Preset. Test it by unselecting and hovering a Group.

Browse By Feature Categories

Web Page Elements
Supported Systems
Visual Page Editor
Design Elements
Media Libraries
Element Properties
Responsive
Animation Effects
Theme Settings
Contact Form
Header & Footer
Blog
E-Commerce
SEO
Custom Code
Application Features
Site & Page Properties
WordPress Widgets

Everything You Need To Create Your Free Website

Use our Website Builder to design and create websites without coding. Drag and drop anything you want, to any place you want it. The Website Creator automatically adapts your website for mobile to make it responsive. Choose from more than 15,000 customisable website templates.

Download for Windows Download for Mac

Related Features

Element Color On Group Hover

For the grouped or Grid Cell Elements, you can change the Element Color on its hover and while hovering a Group or a Grid Cell. Select an Element in a Group. Select the Animation On section's Hover On Group and modify the Color properties in the Property Panel. Unselect the Element, then Hover the Group to test.
Element Shadow On Group Hover

For an Element in a Group or Grid Cell, you can change the Shadow property on Group Hover. Adding Shadow to an Element creates a pseudo-3D effect, which is very popular in web design. In the Hover On Group section of the Property Panel, select the Shadow Preset and optionally edit the Shadow if needed.

Element Scale on Group Hover

Scaling Elements or resizing proportionally on hover can be an interesting Animation Effect that can wow your visitors. You can choose Scale Preset and then modify the Hover On Group properties in the Property Panel by clicking the corresponding link. To test, click somewhere on the Block, then hover.
Company
Product
Themes & Templates
Nicepage
Web Design