javascript - 如何使用 twitter bootstrap 3 使等待图标出现在我的页面中间？

Question

我查看了所有文档，但仍然找不到示例。我想要做的是在进行 Ajax 调用时在我的页面中出现一个等待图标。有人能告诉我如何使用 twitter bootstrap 做到这一点吗？

此外，如果有任何其他更好的非 jquery 实现，我也想知道这些。

谢谢。

Answer 1

只需选择一个 loading icon (gif) 来自 font-awesome for bootstrap，

1. 在 ajax 调用之前显示
2. 一旦 ajax 响应被传递就隐藏

要将图标放置在屏幕中间，请使用以下 css

.ajaxLoader {
   position: absolute;
   top: 50%;
   left: 50%;
   width: 500px;
   height: 500px;
   margin-top: -250px; /* Half the height */
   margin-left: -250px; /* Half the width */
}

1. 另请查看 button loading images
2. JSFiddle