javascript - 手机微信使用scrollTop会闪烁?

Question

在做一个微信的功能，同一个HTML上有Record页面(列出一些记录)和Detail页面(记录的详细内容)，一开始用户查看Record页面(记录有时比较多，会出现滚动条)，然后点击其中一条记录，就会隐藏Record页面显示Detail页面，这个过程还用了hash去控制两个页面，其实就是怕用户在Detail页面里进行“返回”操作时会退出整个页面。因为用了hash，所以用户进行“返回”操作就会显示Record页面隐藏Detail页面。
现在有个问题，就是在进入Detail页面前，我用var scrollTop=$(window).scrollTop();保存了用户进入Detail页面前的位置，当用户进行“返回”操作后，我就设置$(window).scrollTop(scrollTop); 保证用户返回后还是在原来的位置。
因为设置滚动条位置$(window).scrollTop(scrollTop); 需要先把Record页面show()出来才能设置，所以在手机上看的时候会像闪烁了一下的样子，比较难看，试了比较多方法都不行，各位前辈有什么好建议吗？

Answer 1

提供一种思路：

首先，要确定是单纯show()出现了闪烁还是因为设置滚动条位置scrollTop()才闪烁；
其次，如果是因为设置滚动条位置scrollTop()才闪烁，你可以考虑Record页面不隐藏而是重叠在Detail页面下，先设置滚动条位置scrollTop()回到纪录位置后，再隐藏Detail页面，就会凸显Record页面了。

＊这只是想到的思路需要你试试哈

Answer 2

要不要试试将$(window).scrollTop(scrollTop) delay个半秒执行呢？

Answer 3

用timeline去录之前那种返回时重新定位滚动条的方法，发现确实丢帧很严重，查了很多资料，是说这种搞法会重绘整个页面导致很卡。于是我就想，我把列表页绝对定位然而给个z-index，弄他在详情页的上面，用visibility去控制他们的显示和隐藏(之前用display:none，也会重绘原来)，这样的话，就不用重新定位了。后来试试确实可以了，还有些小毛病就是，因为列表页在详情页上面，所以在详情页时滑动的话，返回后会发现列表页也滑动了……
我最后的解决方法是：Record页面绝对定位，然后用visibility:hidden加top:-999em来隐藏页面，使得它无法点击且不占据位置。这跟display:none有巨大区别，这样是不用重绘页面的！所以根本就不用重新去定位滚动条，只是单纯显示隐藏。

Answer 4

history.replaceState