Compare images on AMP pages with amp-image-slider


Earlier this month we announced the experimental release of <amp-image-slider>, an overlaid slider that allows you to compare 2 images that are superimposed on each other. We are now excited to fully launch this component in production.

The benefits of using include:

  • An interoperable interaction model across all devices and platforms.
  • Built-in accessibility – like all of our components, we have designed the component with accessibility in mind. This means we have ensured the component is accessible to both keyboard navigation and screen readers.
  • Ability to customize the component to your site branding by modifying the hint arrows.
  • Ability to customize the interaction model of the component by setting the step size for keyboard navigation, adding labels on the images being compared, etc.

Check out the sample on
AMP by Example and the documentation to learn more, and please file any feedback you have as well!

Posted by Naina Raisinghani, AMP Engineer at Google