Question

我的背景图片正在每次回发时重新加载。因此每次按下按钮都会导致闪烁。它出现在Internet Explorer（测试版本11.0.9600.17843）和Chrome（测试版本45.0.2454.93 m）中。在Firefox（测试版34.0.5）中它可以工作。到目前为止，我没有测试过其他浏览器。这是目前为止背景图片的代码：

<style type="text/css">
body 
{
   background-image:  url(/Img/Besuchermanagement_1920_1080.jpg);

    background-attachment: inherit;
    background-repeat: no-repeat;

    background-position: center;
    background-size: 100% 100%;
    min-height: 925px;

    opacity: 0.9
}       
</style>

当我读到IE闪烁错误时，我还添加了那些元标记：

<meta http-equiv="Page-Enter" content="blendTrans(Duration=0.2)" />
<meta http-equiv="Page-Exit" content="blendTrans(Duration=0.2)" />

但这对我没用。

所以我添加了一张图片并通过此css将其设置为隐藏

.backgroundImageFix 
{
    width: 1%;
    height: 1%;
    opacity: 0.0
}

<asp:Image ID="Image1" runat="server" EnableTheming="True" ImageAlign="Bottom"  CssClass="backgroundImageFix"
    ImageUrl="~/Img/Besuchermanagement_1920_1080.jpg" />

现在我不再有任何闪烁的问题了。

但我不明白为什么添加图片会阻止背景图像重新加载回发。我希望任何人都可以向我解释，也许可以给我一个更好的解决方案。

Answer 1

在回发期间页面重新加载，因为它有一个生命周期，这使页面重新加载，这是闪烁但要避免在asp.net中使用更新面板控件

 <asp:ScriptManager ID="ScriptManager1" runat="server" />

 <asp:UpdatePanel id="UpdatePanel1" runat="server">
     <ContentTemplate>

              //your code here

      </ContentTemplate>
 </asp:UpdatePanel>

这应该会阻止背景图像闪烁

Answer 2

你有几个选择

您应该使用更新面板 - 它只会“回发”面板内的所需数据并重新绘制更新面板内的部分屏幕 - 阅读this以了解Microsoft ajax如何帮助您。我认为您应该使用更新面板，因为它是更好的用户体验。

或者，也可能导致问题，因为未设置正文的背景颜色。它将默认为透明，页面将为白色。您可以尝试将背景颜色设置为与图像类似的颜色。我已经看到这样可以减少过去页面上的闪烁。

asp .net背景图片在回发上闪烁

2 个答案: