Black Friday 2024: 25+ Ways to Save on Online Learning
Creating a Cool Bubble Zoom Effect with CSS

Creating a Cool Bubble Zoom Effect with CSS

Kevin Powell via YouTube Direct link

- Basic styling

3 of 10
Previous
Next

3 of 10

- Basic styling

Class Central Classrooms beta

YouTube videos curated by Class Central.

Classroom Contents

Creating a Cool Bubble Zoom Effect with CSS

Automatically move to the next video in the Classroom when playback concludes
  1. 1 - Introduction
  2. 2 - The HTML
  3. 3 - Basic styling
  4. 4 - Creating the grid
  5. 5 - Animating grid-template-columns
  6. 6 - Scaling up the avatar we hover on
  7. 7 - Scaling up the next sibling
  8. 8 - Scaling up the preceding sibling
  9. 9 - Changing the transition-delay
  10. 10 - Potential cleaning up you might have to do

Never Stop Learning.

Get personalized course recommendations, track subjects and courses with reminders, and more.

Sign up for free
Someone learning on their laptop while sitting on the floor.