0

当您向左或向右滑动移动浏览器时，我正在尝试创建与叠加箭头（即桌面版 chrome）相同的漂亮效果。

我使用 javascript 和 jQuery，现在我可以在滑动时显示箭头。我设法获得了滑动的距离，但我找不到将两者联系起来的方法，所以我只显示了与距离相关的箭头的一部分！

$('#arrow').show('slide',{direction: 'right'},1000);
$('#arrow').fadeIn();
$('#arrow').fadeOut();

我也在尝试用 animate() 来做，但我仍然卡住了：S

谢谢您的帮助

4

1 回答 1

0

您将需要三个值：start, end, current.

在您的情况下，您需要确定start end值是多少。

我会说使用您的可滑动区域（屏幕）的宽度，这会给您0和x（x您的可滑动区域的宽度在哪里）。您已经有了，这是实际滑动结束current之间的距离（也许是滑动的宽度？）。start

获得这些值后，您可以得出一个百分比（介于 0 和 1 之间）并使用@mikakun 的建议将其应用于您的箭头。箭头图形要么需要绝对定位在容器中，要么设置为容器的背景图像。当容器展开以显示更多内容时，这将使您只看到箭头的百分比。一个很好的效果是在您要显示的箭头后面有一个完整箭头的半透明/灰色副本。

于 2013-01-18T03:14:04.943 回答