10

我想知道是否有人知道是否有 jquery 插件，或者如何实现这种在时尚标签krystalrae.com的“收藏”部分可见的效果

截屏视频

任何朝着正确方向的提示或轻推将不胜感激！

谢谢！

4

3 回答 3

25

你可以用 CSS 做到这一点。您所需要的只是一些与窗口高度相同的 div，具有不同的背景图像和属性background-attachment: fixed;。

#one
{
    background: url(http://images.buzzillions.com/images_products/07/02/iron-horse-maverick-elite-mountain-bike-performance-exclusive_13526_100.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment:fixed;
}

#two
{
    background: url(http://img01.static-nextag.com/image/GMC-Denali-Road-Bike/1/000/006/107/006/610700673.jpg);
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment:fixed;
}

http://jsfiddle.net/Kyle_/mbhLN/

于 2012-09-04T09:11:27.357 回答
2

在这里你会找到你的插件！

这是视差效应。

于 2012-09-04T09:02:50.200 回答
0

探索这些东西的一个好方法是使用 firefox 中的firebug插件或 chrome 中的开发者控制台打开页面，然后查看页面源代码。

如果您尝试某些事情，然后发布您遇到的问题，它也会有所帮助。

您还可以使用 jQuery 插件来实现该效果：

  1. http://gsgd.co.uk/sandbox/jquery/easing
  2. http://www.smoothdivscroll.com
于 2012-09-04T09:09:00.403 回答