将div下载为ajax内容加载

我为移动网站创建的表单显示基于先前选择的新字段。 I.E - 用户从下拉菜单（日期）中选择并选择，然后根据选定的日期显示一系列时间。时间直到选定日期才显示出来。将div下载为ajax内容加载

我有一个自旋加载div，而时间通过AJAX在后台加载。我遇到的问题是当“行动”发生在大约三分之三的时候，加载div位于页面的顶部。这个'action'部分位于视口中（这是一个移动网站），加载div位于页面顶部 - 远高于用户视口。

我怎样才能让加载div下降，使它始终在当前的视口？我怎样才能让加载div在用户当前正在考虑滚动条的形式跟随地点？

我一直在尝试使用垂直居中HTML/CSS模型如下所述： http://www.jakpsatweb.cz/css/css-vertical-center-solution.html

但它不工作和页面的中心似乎并没有在每次活动时，形式更新元素被点击。我想我需要使用焦点或模糊事件的表单字段来更新这个和reasses，但我似乎无法得到它的工作。

有没有人有任何提示如何将加载div移动到当前视口区域的中心每次页面增加的时间？

感谢

来源

2011-12-04 timmackay

如果您加载格的设计是公文流转中 - 例如表单中的新内容块 - 最好使用jQuery将内容加载到内容本身中。否则将很难将其定位为像素完美。

如果加载div要作为覆盖文件显示，那么您可以使用fixed CSS定位，并将其设置为z-index。要将其集中在所有屏幕分辨率上，请使用jQuery和公式(window.height() - div.height())/2作为顶部像素位置。该代码将类似于this answer。

希望帮助

来源

2011-12-05 00:08:19 Tak

它看起来像固定的定位是要走的路 - 感谢您的回答和背景的讨论环节。 – timmackay

感谢您的帮助和解答。我将你的标记标记为正确，因为提到了固定位置，前一个线索和公式的链接。所有的答案对解决我的问题都非常有帮助。干杯。 – timmackay

如果你做这样的事情，并把你的div标签<body>里面，它会留在可见光区的中间。

div.loading { 
position: fixed; 
top: 47%; 
left: 47%; 
height: 6%; 
width: 6%; 
z-index: 1000; 
}

另一种解决方法是把它放在容器内容的最后会加载进去。只要确保在它之前加载内容。如果你给它一个margin:auto;它会保持在中间，并继续推下去。

编辑：这也是值得注意的答案here。这将防止以用户无法修复的方式遮盖重要的事物。

来源

2011-12-05 00:14:52 FakeRainBrigand

这实际上是在保证装载一个非常优雅的方式为最新内容的底部。再次，看起来像固定定位是一条路。谢谢。 – timmackay

谢谢你，你的答案是真正有用的，我标志着另一个是正确的，因为链接到较早线程和公式但均在解决问题非常有帮助。再次感谢。 – timmackay

将您的加载div的位置设置为固定，这当然会导致它在DOM结构中从其父项转义，您将需要将它放在您想要的位置。固定位置相对于视口的可见区域。

<html> 
<head> 
<style type="text/css"> 
    #loader { 
     height: 30px; 
     position: fixed; 
     top: 50%; 
     left: 50%; 
     background: #ccc; 
    } 
</style> 
</head> 
<body> 
    <div id="loader">Loading...</div> 
</body> 
</html>

这将导致加载器div始终居中在屏幕上，无论用户在哪里滚动，左/右上/下。

来源

2011-12-05 00:16:41

将div下载为ajax内容加载

回答

相关问题