jquery - 将背景颜色过渡到偏移位置

Question

使用 jQuery 和 jQuery.Colors，我一直在尝试想出一种方法，在滚动带框架的 div 时将背景颜色与偏移位置相关联。

您可以在这里查看我的示例: http://coreycapetillo.com/tests/colors/index.html

目前，当偏移位置达到一定的数字范围时，背景颜色会发生变化。然而，我想知道是否可以让它更有机地移动，模仿纯色渐变效果。

我认为最简单的解决方法是使用 4 个具有 4 种不同背景颜色的空 div。然后使用一些基本数学将不透明度(每个 div 使用不同的偏移量)设置为 offset().left 数字。

我正在寻找需要更少空 DIV 和更流畅的东西。这是我第一次在 stackOverflow 上发帖，所以我希望我已经提供了足够的信息，以便在我需要前进的方向上获得一些指导。

Answer 1

这可能不完全是您想要的“渐变”效果，但是您不能使用偏移量在一个 div 上设置类(例如，在 100px 处设置类“绿色”，在 500px 处设置类“蓝色”) ”等)，并使用 css 过渡来处理淡入淡出？参见示例: http://jsfiddle.net/juanojeda/bKRuQ/

本例使用的是点击，但原理与监听offset事件是一样的。