时间戳

首页 > 解决方案 > 使用 jQuery 更改相对于滚动距离的图像大小

javascript - 使用 jQuery 更改相对于滚动距离的图像大小

问题描述

我一直在尽力创建一个 JS 功能，其中图像的大小取决于我滚动了多少。不是瞬间从 A 变为 B 的大小，而是相对于滚动距离逐渐变化。当图像达到最小尺寸时，页面的其余部分会滚动。

我无法让我正常工作，所以我重新开始并制作了一个动画，而不是在检测到滚动时激活。但它看起来不太好，也不是我想要的。所以我需要回到第一个解决方案，我希望有人可以帮助或指出我正确的方向。

Apple 在他们的新 iMac 页面上做的正是我想要的：https ://www.apple.com/imac-24/ （向下滚动到“The Croods - A New Age”演示文稿的部分）。

这是我的动画js：

$(".photo_main").animate({
    width: minsize+"px",
    height: "auto",
    top: "10px",
    left: "10px"
}, 300, "swing", function() {
    $(".photo_main").addClass('animated');
    releaseScroll();
});

标签： javascriptjqueryjquery-animate

解决方案

推荐阅读