Skip to content

Instantly share code, notes, and snippets.

@jaxgeller
Last active February 12, 2017 20:37
Show Gist options
  • Save jaxgeller/7f0b779cc5205529b8decf92ea04f855 to your computer and use it in GitHub Desktop.
Save jaxgeller/7f0b779cc5205529b8decf92ea04f855 to your computer and use it in GitHub Desktop.
<html>
<body>
<div id="parttwoimg"><img src="./images/parttwo_1.jpg" width="300"></div>
<script>
var onScrollHandler = function() {
var yourImageElement = document.querySelector('#parttwoimg img')
var newImageUrl = yourImageElement.src;
var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
if (scrollTop > 100) {
newImageUrl = "./images/sequence/sequence_1.jpg"
}
if (scrollTop > 200) {
newImageUrl = "./images/sequence/sequence_2.jpg"
}
if (scrollTop > 300) {
newImageUrl = "./images/sequence/sequence_3.jpg"
}
yourImageElement.src = newImageUrl;
};
object.addEventListener ("scroll", onScrollHandler);
</script>
</body>
</html>
@jaxgeller
Copy link
Author

then you would need

var yourImageElement = document.getElementById('parttwoimg')

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment