← All examples

Image hover-zoom (CSS)

Smoothly enlarges any image when you hover over it and lifts it above surrounding content.

Code to copy

/* Smoothly scale up any image when the pointer hovers over it. */
img {
  transition: transform 0.2s ease;
}
img:hover {
  transform: scale(1.6);
  position: relative;
  z-index: 9999;
}

How to use this example

1. Copy the code with the button above.
2. Install JustZix (2 minutes) and open the extension on the target page.
3. Add a new rule matching that page.
4. Paste the code into the rule's CSS panel and save — the effect appears instantly.