Question

我试图在这个网站上解决问题。（http://www.yunke.es）

在IE（10,11）和（Chome，Firefox等）中工作正常，但在Edge中，不同部分的背景隐藏在整个网络上，并且无法访问内容（文本和图像））我已经完成了改变Css属性的测试......例如＆＃34; position＆＃34;，但效果不佳。有什么想法吗？

＆＃13;

#backgrounds {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-transition: -webkit-transform .6s ease-out;
    -moz-transition: -moz-transform .6s ease-out;
    -ms-transition: -ms-transform .6s ease-out;
    -o-transition: -o-transform .6s ease-out;
    transition: transform .6s ease-out;
    background: url(../img/loader.gif) no-repeat center center #000;
}

#contents, #layer-1, #layer-2 {
    visibility: hidden;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -webkit-transition: -webkit-transform .6s ease-out;
    -moz-transition: -moz-transform .6s ease-out;
    -ms-transition: -ms-transform .6s ease-out;
    -o-transition: -o-transform .6s ease-out;
    transition: transform .6s ease-out;
}

＆＃13;

<div id="backgrounds" style="transform: translate3d(0px, 0px, 0px);">
	<article class="item-0" style="height: 773px;"></article>
	<article class="item-1" style="height: 773px; background-position: 0px 0px;"></article>
	<article class="item-2" style="height: 1161px;"></article>
	<article class="item-3" style="height: 773px;"></article>
	<article class="item-4" style="height: 773px;"></article>
	<article class="item-5" style="height: 773px;"></article>
	<article class="item-6" style="height: 2146px;"></article>
	<article class="item-7" style="height: 773px;"></article>
	<article class="item-8" style="height: 773px;"></article>
	<article class="item-9" style="height: 773px;"></article>
	<article class="item-10" style="height: 1040px;">
		<div class="crazy">
			<img src="http://yunke.es/assets/img/background-6-1.png" style="right: -442.013%;">
		</div>
	</article>
</div>

<div id="contents" style="transform: translate3d(0px, 0px, 0px); visibility: visible;">
	
	<article class="item-0" style="height: 927.6px;"></article>
	
	<article class="item-1" style="height: 927.6px;">
		<div class="mask" style="height: 773px; transform: translate3d(0px, -309.2px, 0px);">
			<img class="masked" src="http://yunke.es/assets/img/background-2-1.png" style="transform: translate3d(0px, 309.2px, 0px);">
		</div>
		<div class="mask" style="height: 773px; transform: translate3d(0px, -309.2px, 0px);">
			<img class="masked eyes-open" src="http://yunke.es/assets/img/background-2-2.png" style="visibility: hidden; transform: translate3d(0px, 309.2px, 0px);">
		</div>
	</article>
 </div>

＆＃13;

Answer 1

Microsoft Edge似乎有一个使用像素单位属性translate3d的Bug。改变＆＃34; px＆＃34; in＆＃34;％＆＃34;将解决问题。

Microsoft Edge在其他元素

1 个答案: