[请教] 有谁知道 https://selfstore.io 中随便点一个链接后、窗口顶部会有一个红色进度条出现、然后再跳转页面的效果是如何实现的？
hustlzp · hustlzp · 2015-04-20 16:15:35 +08:00 · 5550 次点击这是一个创建于 3500 天前的主题，其中的信息可能已经有所发展或是发生改变。
 |
1
moliliang 2015-04-20 16:21:31 +08:00  1
turbolinks
|
 |
2
no13bus 2015-04-20 16:22:20 +08:00 2
|
|
3
no13bus 2015-04-20 16:23:22 +08:00
|
 |
4
thcode 2015-04-20 16:24:28 +08:00 1
http://instantclick.io/
你可以参考一下这个代码中的 progress bar |
 |
5
chloerei 2015-04-20 16:25:09 +08:00 3
现在用的是 Turbolinks 自带的进度条，Turbolinks 是 Rails 框架默认的组件。
非 Turbolinks 应用可以看这个 https://github.com/rstacruz/nprogress/ ，要注意只有在 AJAX 更新的时候才有作用。 |
 |
6
faceair 2015-04-20 16:25:33 +08:00 1
nprogress
|
 |
8
cj941030 2015-04-20 16:33:30 +08:00 1
|
 |
9
icyflash 2015-04-20 16:35:14 +08:00 via Android 1
nprogress + pjax
|
 |
10
oott123 2015-04-20 17:00:50 +08:00 1
其实你可以考虑一下 InstantClick ……
|
 |
11
daben1990 2015-04-20 17:47:48 +08:00
效果真的不错，打算下次页面用下
|
 |
12
r00tt 2015-04-20 19:30:56 +08:00 via Android 1
有个gem nprogress.
|
 |
13
jingwentian 2015-04-20 19:34:35 +08:00 1
|
 |
14
lincanbin 2015-04-20 20:52:12 +08:00 via Android
pjax加个进度条。
实际上就是Ajax并在回调后修改地址栏和历史记录。 理解了这一点，做进度条就非常容易了。 |
 |
15
ChiangDi 2015-04-20 20:54:04 +08:00
但是我感觉这个进度条是纯骗人的，连不上的时候它也会慢慢的前进。
|
 |
16
0x142857 2015-04-20 21:10:35 +08:00
pace
pace pace |
 |
17
virusdefender 2015-04-20 21:35:22 +08:00 1
amazeui就有这个工具 http://amazeui.org/javascript/nprogress
|
 |
19
hustlzp OP @virusdefender wow, cool!
|
 |
21
dallaslu 2015-04-21 00:02:34 +08:00
是 pjax 嘛？
|
 |
22
endoffight 2015-04-21 08:40:26 +08:00 via Android
油管也有这种效果
|
 |
23
SharkIng 2015-04-21 08:45:54 +08:00
搭车问下PHP里面（如CI，Laravel框架）有没有类似的组件？
|
 |
24
cxe2v 2015-04-21 08:55:47 +08:00
淘宝不就是换上了这个效果么？
|
 |
26
SmiteChow 2015-04-21 12:02:08 +08:00
pjax
|
 |
27
jyz19880823 2015-04-21 17:44:00 +08:00
最早是 youtube, 然后是 ruby-china
|
Select Language