Internet Explorer

Question

我正在开发一个网站，其中包含一个带有css背景图像的div

background-attachment:fixed;

这在所有浏览器MINUS Internet Explorer中看起来都不错。通过javascript实现平滑滚动不是一种选择。

所以我找到了一个允许我确定何时使用IE 10和11的插件。 https://github.com/stowball/Layout-Engine

我用以下代码测试了这个

    <script type="text/javascript">
        if (layoutEngine.vendor === 'ie' && layoutEngine.version === 11) {
            alert("using IE 11");
        }
    </script>

得到以下

所以我知道这是有效的。所以我使用相同的概念来使用Jquery添加一个额外的类。

CSS

  .grouppic{
      background-attachment:fixed;
  }

  .grouppicIEVersion{
      background-attachment:inherit !important;
  }

的Javascript

<script type="text/javascript">
    if (layoutEngine.vendor === 'ie' && layoutEngine.version === 11) {
        $('#groupPicture').addClass("grouppicIEVersion");
    }
</script>

HTML

  <div class="w-section grouppic " id="groupPicture">
    <div class="w-container">
    </div>
   </div>

但这不起作用。该课程未在Internet Explorer中添加。我不确定这是一个jquery错误还是我正在使用的插件。一些帮助会很棒。

Answer 1

正如http://www.raywenderlich.com/68613/create-paid-lite-version-iphone-app所述，这需要包含在文档就绪函数中，否则DOM可能没有加载，因此body元素可能尚不存在。

我要做的另一点是将一个类附加到$(function(){ if (layoutEngine.vendor === 'ie' && layoutEngine.version === 11) { $("body").addClass("msie11"); } }); 并在CSS中使用它。这意味着您只需附加一次类，然后可以使用CSS从那时起应用浏览器覆盖。

例如：

.grouppic{
    background-attachment:fixed;
}

.msie11 .grouppic{
    background-attachment:inherit !important;
}

然后CSS可以是：

var previousTime = 0;

function animate() {
    requestAnimationFrame(animate);
    var currentTime = audio.currentTime;
    var delta = currentTime - previousTime;
    previousTime = currentTime;

    THREE.AnimationHandler.update(delta);
    renderer.render(scene, camera);
}

Answer 2

但你可以很容易地找到使用css hack＆＃39;然后为什么要使用其他插件来找出

＆＃13;

＆＃13;

<style>
    @media all and (-ms-high-contrast:none)
     {
     .grouppicIEVersion{ background-attachment:inherit !important;  } /* IE10 */
     *::-ms-backdrop, .grouppicIEVersion{background-attachment:inherit !important;
  } /* IE11 */
     }
  </style>

＆＃13;

＆＃13;

＆＃13;

这里有你可以查看的参考链接
的 Reference Link

Answer 3

将其包裹在$.ready()：

中

$(document).ready(function() {
    if (layoutEngine.vendor === 'ie' && layoutEngine.version === 11) {
        $('#groupPicture').addClass("grouppicIEVersion");
    }
});

可能当你想要添加这个类时，元素#groupPicture在DOM中不可用。

同时检查控制台中的错误。