Is there a way to decrease the width of my div element when I scroll down, and then increase it back up when the user scrolls back to the top (150 pixels or less)?
I attempted the code below which successfully reduces the width while scrolling down, but does not return to the original width when scrolling to the top.
I'm unsure of what I may be overlooking.
$(document).scroll(function() {
var scrollPosition = $(this).scrollTop();
if (scrollPosition <= 150) {
$("div.mydiv").animate({
width : "20%"
});
}
else {
$("div.mydiv").animate({
width : "50px"
});
}
});
Any suggestions on what I need to add or change?
Thank you