最近对前端有点兴趣，最近碰见一个网站，但是对它这个网站有些地方的实现方法不是很懂！有没有人能解释下啊？
iMouseWu · 2013-09-16 00:38:17 +08:00 · 4468 次点击这是一个创建于 4124 天前的主题，其中的信息可能已经有所发展或是发生改变。
http://www.guirebustini.com.br/
就是这个网页！有没有知道他这个模式显示的方式呀？
主要在这几个方面：
1.首页进去的页面，当滚动滑轮的时候该页面是不会移动的，当下一个页面达到满屏的时候，下一张页面出来，那么这张页面的位置也是不会变得。都是被后者慢慢覆盖！（这里经过我的测试各个div是一层覆盖一层的关系，也就是说这里是通过z-index来实现的，但是具体的能不能给点提示）.我觉得应该是滚动过程中，如果一个div已经满屏的话就给加一个fix，那么就可以实现了了！不知道对不对？
2.覆盖过程中，前一个页面的字和图片会有稍微上移的感觉，让人的感觉就是，这些字不是一下子被覆盖的！怎么感觉有点像响应式的味道！
这点又是怎么实现的
3.首页音乐框中背景原来是灰色的，但是鼠标移上去会有蓝色滑动出来，个人有种感觉是通过移动图片来实现的，就是修改图片的位置。但是这样子的话不是应该有2个div一个是灰色的，但是这样子不是会覆盖下面的div的内容为什么上面的字还是能显示出来。所以貌似这个假设不成立，能不能给点提示？
因为最近才接触前端，所以实现效果不是很懂！希望大家可以分析下！
谢谢的
就是这个网页！有没有知道他这个模式显示的方式呀？
主要在这几个方面：
1.首页进去的页面，当滚动滑轮的时候该页面是不会移动的，当下一个页面达到满屏的时候，下一张页面出来，那么这张页面的位置也是不会变得。都是被后者慢慢覆盖！（这里经过我的测试各个div是一层覆盖一层的关系，也就是说这里是通过z-index来实现的，但是具体的能不能给点提示）.我觉得应该是滚动过程中，如果一个div已经满屏的话就给加一个fix，那么就可以实现了了！不知道对不对？
2.覆盖过程中，前一个页面的字和图片会有稍微上移的感觉，让人的感觉就是，这些字不是一下子被覆盖的！怎么感觉有点像响应式的味道！
这点又是怎么实现的
3.首页音乐框中背景原来是灰色的，但是鼠标移上去会有蓝色滑动出来，个人有种感觉是通过移动图片来实现的，就是修改图片的位置。但是这样子的话不是应该有2个div一个是灰色的，但是这样子不是会覆盖下面的div的内容为什么上面的字还是能显示出来。所以貌似这个假设不成立，能不能给点提示？
因为最近才接触前端，所以实现效果不是很懂！希望大家可以分析下！
谢谢的
 |
1
loethen 2013-09-16 09:07:23 +08:00
视差滚动。google之。
|
 |
2
rrfeng 2013-09-16 09:16:29 +08:00
滚动的时候这个页面的 chrome 进程 cpu 占用率达到了 50% ……
我是不是该换电脑了 |
 |
3
bunorte 2013-09-16 09:35:04 +08:00
主要用到的技术是jquery的animate、相对定位，跟响应式没什么关系。详细的js代码页面底部都有了，仔细看看就明白了。不懂jquery的话下载个api手册看看。
|
 |
4
piresion 2013-09-16 09:43:15 +08:00
看看苹果5c的页面：http://www.apple.com/cn/iphone-5c/
|
 |
5
anson0370 2013-09-16 10:16:23 +08:00  1
|
|
6
anson0370 2013-09-16 10:18:34 +08:00 1
才发现楼主居然有两个贴……另一个贴也已经有人回过了orz
|
 |
8
66beta 2013-09-17 11:42:29 +08:00
始祖：Nike Better World
|
|
15
66beta 2013-09-17 12:02:07 +08:00
|
 |
17
SharkIng 2013-09-18 05:02:17 +08:00
记得V2有一个女生做那个网站前段时间测试版的时候就用的这个功能
|
 |
18
P233 2013-09-18 05:45:32 +08:00
|
Select Language