Skip to content

Instantly share code, notes, and snippets.

@diggeddy

diggeddy/GP PageHeader Background Zoom

Last active May 30, 2018 18:19
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save diggeddy/eeb0fb894b1b94be27daf29bee6bfbe7 to your computer and use it in GitHub Desktop.
Save diggeddy/eeb0fb894b1b94be27daf29bee6bfbe7 to your computer and use it in GitHub Desktop.
Download ZIP
Adds a zoom effect to background image
Raw
GP PageHeader Background Zoom
<script type="text/javascript">
window.onload = function() {
var pageHeader = document.querySelectorAll(".generate-content-header");
pageHeader[0].classList.add("zoom");
}
</script>
.generate-content-header {
background-size: 100%;
transition: background-size 2s ease-in;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
}
.generate-content-header.zoom {
background-size: 110%;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment