ASP.NET IE中的闪烁
本文关键字：闪烁 IE NET ASP | 更新日期: 2023-09-27 18:37:25
我是开发 asp.net 网站的新手，当我从一个页面导航到另一个页面或只是单击我自己的部分菜单时，它在IE9中闪烁（尚未测试其他IE版本），但在Firefox中没有。我在互联网上搜索并找到了这个解决方案：
<meta http-equiv="Page-Enter" content="blendTrans(Duration=0)" />
<meta http-equiv="Page-Exit" content="blendTrans(Duration=0)" />
但这实际上对我不起作用...
这是我的网站。母版页：
<%@ Master Language="C#" AutoEventWireup="true" CodeBehind="Site.master.cs" Inherits="HomeSite.SiteMaster" %>
<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head runat="server">
<title></title>
<meta http-equiv="Page-Enter" content="blendTrans(Duration=0)" />
<meta http-equiv="Page-Exit" content="blendTrans(Duration=0)" />
<link type="text/css" rel="stylesheet" href="~/Styles/Site.css" />
<asp:ContentPlaceHolder ID="HeadContent" runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form runat="server">
<div class="page">
<div class="header">
<div class="loginDisplay">
<asp:LoginView ID="HeadLoginView" runat="server" EnableViewState="False">
<AnonymousTemplate>
[ <a href="http://www.flofab.com/partners.asp" ID="HeadLoginStatus" runat="server">Partner Login</a> ]
</AnonymousTemplate>
<LoggedInTemplate>
Welcome <span class="bold"><asp:LoginName ID="HeadLoginName" runat="server"
meta:resourcekey="HeadLoginNameResource1" /></span>!
[ <asp:LoginStatus ID="HeadLoginStatus" runat="server" LogoutAction="Redirect"
LogoutText="Log Out" LogoutPageUrl="~/"
meta:resourcekey="HeadLoginStatusResource1"/> ]
</LoggedInTemplate>
</asp:LoginView>
</div>
</div>
<div class="menuContainer">
<div class="menuRight">
<asp:Menu ID="NavigationMenu" runat="server" CssClass="menu"
EnableViewState="False" IncludeStyleBlock="False" Orientation="Horizontal"
meta:resourcekey="NavigationMenuResource1">
<Items>
<asp:MenuItem NavigateUrl="~/Default.aspx" Text="Home"
meta:resourcekey="MenuItemResource1"/>
<asp:MenuItem NavigateUrl="~/Literature.aspx" Text="Documents"
meta:resourcekey="MenuItemResource2"/>
<asp:MenuItem NavigateUrl="~/Photos.aspx" Text="Photos & videos"
meta:resourcekey="MenuItemResource4"/>
<asp:MenuItem NavigateUrl="~/Download.aspx" Text="Download"
meta:resourcekey="MenuItemResource5"/>
<asp:MenuItem NavigateUrl="~/About.aspx" Text="About"
meta:resourcekey="MenuItemResource6"/>
</Items>
</asp:Menu>
</div>
<div class="menuLeft">
</div>
</div>
<div class="subMenu">
<img src="Styles/images/Blue-Background.jpg" alt="" width="100%" height="150px" style="vertical-align: top;" />
<img src="Styles/images/Logo_Flofab.png" alt='' height='100px' style="position:absolute;z-index:2;top:5px;left:120px;" />
</div>
<div class="main">
<asp:ContentPlaceHolder ID="MainContent" runat="server"/>
</div>
</div>
<div class="footerContainer">
<div style='float:left;'>Copyright © 2012 Flofab All rights reserved.</div>
<div style='float:right;'>
<a href='http://www.linkedin.com'>
<img src="Styles/images/linkedin.png" alt='' style='border:0;' />
</a>
<a href='http://www.twitter.com'>
<img src="Styles/images/twitter.png" alt='' style='border:0;' />
</a>
<a href='http://www.facebook.com'>
<img src="Styles/images/facebook-icon.png" alt='' style='border:0;' />
</a>
</div>
</div>
</form>
</body>
</html>
现在这是我的默认.aspx
<%@ Page Title="Flofab" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
CodeBehind="Default.aspx.cs" Inherits="HomeSite._Default" %>
<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
<div id='mainTitle' class='mainTitle' runat='server'>
Home
</div>
<div id='mainBody' class='mainBody'>
<p>
Put text here...
<br />
This is some text to be sure it's placed over the FF logo. <br /> Is my text over it? I'm going to check now...
</p>
</div>
</asp:Content>
还有我的.css文件
body
{
/*background-color: #fff;*/
width:100%;
height:100%;
margin: 0px;
padding: 0px;
color: #575757;
font: 12px/18px "Lucida Grande","Lucida Sans Unicode",Helvetica,Arial,Verdana,sans-serif;
background-image:url('images/Body-Background.jpg');
background-repeat:repeat-x;
}
a:link, a:visited
{
color: #034af3;
}
a:hover
{
color: #1d60ff;
text-decoration: none;
}
a:active
{
color: #034af3;
}
p
{
margin: 0 10px 10px 10px;
line-height: 1.6em;
}
table
{
margin: 5px;
border: 1px solid #4194E7;
border-collapse:collapse;
padding-left: 5px;
padding-right: 5px;
}
table th
{
border-bottom: 1px solid #4194E7;
background-image:url('images/Menu-Background.jpg');
background-repeat:repeat-x;
color:White;
padding-right: 10px;
}
table td
{
border-bottom: 1px solid #4194E7;
padding: 5px;
}
tr.row1
{
background-color: #B4D4FA;
}
tr.row2
{
background-color: #A0D4FA;
}
.page
{
width: 80%;
min-width:600px;
margin: 2px auto 0px auto;
}
.header
{
position: relative;
margin: 0px;
padding: 0px;
width: 100%;
min-height:50px;
}
.header h1
{
font-weight: 700;
margin: 0px;
padding: 0px 0px 0px 20px;
color: #000;
border: none;
line-height: 2em;
font-size: 2em;
}
.subMenu
{
margin-top: 35px;
/*border: 1px solid gray;*/
position: relative;
}
.main
{
margin-top: 5px;
min-height: 420px;
border-left: 1px solid #4194E7;
border-right: 1px solid #4194E7;
border-bottom: 1px solid #4194E7;
background-color:#C8D4FA;
}
.mainTitle
{
padding: 5px 0px 2px 10px;
/*border-bottom: 1px solid white;*/
background-image:url('images/Menu-Background.jpg');
background-repeat:repeat-x;
font-size: 1.5em;
font-variant: small-caps;
font-weight: bold;
color: #fff;
min-height:25px;
}
.mainBody
{
background-image:url('images/LogoFF-Filigrane.png');
background-repeat:no-repeat;
min-height: 395px; /*.main height - .mainTitle height*/
padding-top:5px;
}
.mainItems
{
padding-left: 10px;
padding-right: 10px;
margin-top:5px;
border-bottom: 1px solid gray;
/*background-color:#B8B8B8;*/
font-size: 1em;
font-variant: small-caps;
text-transform: none;
width: 120px;
}
.leftCol
{
padding: 6px 0px;
margin: 12px 8px 8px 8px;
width: 200px;
min-height: 200px;
}
.footerContainer
{
color: #fff;
padding-left: 2px;
margin: 0px auto;
text-align: center;
line-height: normal;
width: 80%;
}
.footerContainer a:link
{
text-decoration:none;
}
div.menuContainer
{
float:right;
width:100%;
background-image:url('images/Menu-Background.jpg');
background-repeat:repeat-x;
border-top:1px solid gray;
}
div.menuLeft
{
width:100%;
color:#ff99dd;
display:inline;
}
div.menuRight
{
color:#ff99dd;
float:right;
display:inline;
}
.menu
{
padding: 0;
margin: 0;
min-height: 30px;
}
div.menu ul
{
margin: 0;
padding: 0;
float:right;
}
div.menu ul li
{
display: block;
float:left;
background-image:url('images/Menu-Background.jpg');
background-repeat:repeat-x;
border-left:1px solid white;
}
div.menu ul li a
{
color: #fff;
float: left;
padding: 0.3em 1em 0.7em;
text-decoration: none;
}
div.menu ul li a:hover
{
color: #000;
}
div.menu ul li a:active
{
color: #777;
text-decoration: none;
}
fieldset
{
margin: 1em 0px;
padding: 1em;
border: 1px solid #ccc;
}
fieldset p
{
margin: 2px 12px 10px 10px;
}
fieldset.login label, fieldset.register label, fieldset.changePassword label
{
display: block;
}
fieldset label.inline
{
display: inline;
}
legend
{
font-size: 1.1em;
font-weight: 600;
padding: 2px 4px 8px 4px;
}
input.textEntry
{
width: 320px;
border: 1px solid #ccc;
}
input.passwordEntry
{
width: 320px;
border: 1px solid #ccc;
}
div.accountInfo
{
width: 42%;
}
.clear
{
clear: both;
}
.titleLogo
{
display: block;
float: left;
text-align: left;
width: auto;
}
.loginDisplay
{
font-size: 1.1em;
display: block;
text-align: right;
padding: 10px;
color: #fff;
}
.loginDisplay a:link
{
color: #fff;
text-decoration:none;
}
.loginDisplay a:visited
{
color: #fff;
}
.loginDisplay a:hover
{
color: #fff;
}
.failureNotification
{
font-size: 1.2em;
color: Red;
}
.bold
{
font-weight: bold;
}
.submitButton
{
text-align: right;
padding-right: 10px;
}
.floatLeft
{
float:left;
}
.floatRight
{
float:right;
}
.errorContent
{
color: Red;
text-align: center;
font-size: 1.2em;
}
知道是什么让IE闪烁吗？
我没有将图像显示为背景和菜单，而是更改为 css 线性渐变，不再闪烁。看起来像IE缓存问题。