Question

我正在使用Node-Webkit编写一个阅读应用程序的文档。文档可以长达数百页，界面允许将文档打开到特定章节。显示初始章节后，我想异步加载本书的其余部分。由于我不知道读者会滚动的方向，我的策略是在初始章节之前和之后交替加载章节：

加载章x - ＆gt;加载章x-1 - ＆gt;加载章x + 1 - ＆gt;载入x-2 - ＆gt;加载x + 2 ...

我在包含div元素中显示该书，每个章节都是容器中的div。我正在使用jquery .before（）和.after（）来插入每个章节。

我的问题是，当我在本书前面添加章节时，浏览器会自动向上滚动。因此，如果我从第10章开始，当我添加第9章时，浏览器会向上滚动，再次使用第8章，等等。

该问题的一个（不令人满意的）解决方案是为每个章节制作一个锚标记并存储加载的第一章的id。然后在获取每一章后，运行代码：

window.location.href = #originalChapter

将第一章保留在浏览器视口中。当然，问题在于，当书籍的其余部分被加载时，读者无法滚动。

理想情况下，我想禁用滚动，加载章节然后重新启用，直到获取下一章。我到目前为止还无法弄清楚如何做到这一点。

Answer 1

我认为简单的解决方案是在加载之前不要在DOM中包含元素。用户将无法滚动，因为没有要滚动的内容。然后，只需在添加元素时保留视口即可。

获取滚动容器的初始位置和溢出容器的高度：

var scrollTop = $scroll.scrollTop(),
    height    = $container.height();

并在prepend个新元素时使用它们来保留视口。在进行append操作时，您无需执行任何操作。

var newHeight    = $container.height(),
    newScrollTop = scrollTop + newHeight - height;
$scroll.scrollTop(newScrollTop);

以下是一个简单示例：http://jsfiddle.net/Wexcode/tfszaocz/

Answer 2

如果要从锚点（import matplotlib.pyplot as plt from matplotlib.collections import PolyCollection from mpl_toolkits.mplot3d import axes3d import numpy as np data1=eval(input()) freq_data = np.logspace(-15,15,500)[:,None]*np.ones(10)[None,:] amp_data = data1 rad_data = np.array([1,2,3,4,5,6,7,8,9,10]) verts = [] for irad in range(len(rad_data)): xs = np.concatenate([[freq_data[0,irad]], freq_data[:,irad], [freq_data[-1,irad]]]) ys = np.concatenate([[0],amp_data[:,irad],[0]]) verts.append(list(zip(xs, ys))) poly = PolyCollection(verts) poly.set_alpha(0.7) fig = plt.figure() ax = fig.add_subplot(111, projection='3d') # The zdir keyword makes it plot the "z" vertex dimension (radius) # along the y axis. The zs keyword sets each polygon at the # correct radius value. ax.add_collection3d(poly, zs=rad_data, zdir='y') ax.set_xlabel('symlog') ax.set_xlim(freq_data.min(), freq_data.max()) ax.set_xlabel('Frequency') ax.set_ylim(rad_data.min(), rad_data.max()) ax.set_ylabel('Radius') ax.set_zlim(amp_data.min(), amp_data.max()) ax.set_zlabel('Amplitude') plt.show()）标记的单击处理程序更新DOM，请确保从回调函数返回false。

防止DIV滚动DOM内容更改

2 个答案: