时间戳

首页 > 解决方案 > 立即加载另一个站点并使用 CSS 正确定位它？

javascript - 立即加载另一个站点并使用 CSS 正确定位它？

问题描述

我有一个angularjsWeb 应用程序，它iframe在指定的div. Internet Explorer 11 加载angularjs+的requirejs速度非常慢，以至于我需要等待大约 4 秒钟，直到触发另一个站点的加载（iframesrc注入到dom.

<html>
  <body>
    <div ng-app="module">
      <!-- happens after 3-4 seconds due to the delay mentioned above-->
      <div id="otherapp">
        <iframe src="https://www.bing.com">
        Another Site
        </iframe>
      </div>
    </div>
  </body>
</html>

我想通过这样的方式来并行化它：

<html>
  <body>
    <div id="othersite">
      <!-- loads immediately -->
      <iframe src="https://www.bing.com">
      Other Site
      </iframe>
    </div>
    <div ng-app="module">
      <!-- bring it here either using dom manipulation or css -->
      <div id="othersiteholder">
      </div>
    </div>
  </body>
</html>

由于有iframe，我无法使用移动div元素appendChild。是否有可以在这里使用的 CSS 解决方案作为定位问题？就像是：

  1. 创建otherapp div一个absolute位置。
  2. otherappholder div应用程序将为此页面创建一个并留下一些位置。
  3. 它计算它的偏移量并重新定位otherapp div.

虽然这是一个angularjs应用程序，但我正在寻找一个纯基于 CSS 的解决方案来解决这个问题，使用position: absolute等position: relative。

标签： javascripthtmlcssangularjsinternet-explorer-11

解决方案

推荐阅读