Подменю ASP.Net не отображается в IE после установки градиента фильтра. - PullRequest
Новая
       28

Подменю ASP.Net не отображается в IE после установки градиента фильтра.

0 голосов
/ 16 августа 2011

Я использую элемент управления меню asp.net (4.0).

Чтобы справиться с проблемой «мерцания меню», я настраиваю отображение для подменю «Нет».Проблема, с которой я столкнулся, заключается в том, что подменю (третий уровень) не отображается в IE (по крайней мере, IE 7-8), когда я использую фильтр для градиента.

Я думаю, что градиент фильтра каким-то образом портится с z-index, поскольку, если я удаляю z-index, установленный asp.net с помощью встроенных в IE инструментов разработчика, отображается подменю (с неправильнымz-index, но, по крайней мере, он появляется).Я попытался установить z-index вручную, используя css или JavaScript при загрузке страницы, но я не могу отобразить его.

Вот css и разметка: 

   <html xmlns="http://www.w3.org/1999/xhtml">
   <head runat="server">
   <title></title>
   <style type="text/css">

   .MenuFix ul li ul
   {
     display:none; 
   }
    div.menu ul ul 
   {
     background-color: #003775;
     background: -webkit-gradient(linear, left top, left bottom, from(#003775), to(#001F42));
     background: -moz-linear-gradient(top, #003775, #001F42);
    /*Either filter causes the problem*/
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#003775, endColorstr=#001F42); 
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#003775, endColorstr=#001F42)"; 
     position:absolute;
    }

    </style>
    </head>
    <body>
      <form id="form1" runat="server">
      <div class="PageWrapper">
       <div class="header">
       <div class="MainMenu MenuFix">
       <asp:Menu ID="mnMainMenu" Orientation="Horizontal" CssClass="menu" runat="server"  
         StaticSubMenuIndent="16px" DynamicPopOutImageTextFormatString="" 
            StaticEnableDefaultPopOutImage="False">
         <DynamicMenuStyle />
         <Items>
         <asp:MenuItem  Text="Home" />
         <asp:MenuItem Text="Top Level Item 2">
               <asp:MenuItem  Text="Sub Item" />
               <asp:MenuItem Text="Sub Menu" >
                    <asp:MenuItem  Text="Not Displayed" />
                    <asp:MenuItem  Text="Not Displayed" />               
              </asp:MenuItem>
              <asp:MenuItem Text="Sub Item" />
            </asp:MenuItem>
            <asp:MenuItem  Text="Top Level Item 3" />
         </Items>
         <StaticMenuItemStyle HorizontalPadding="10px" VerticalPadding="5px" />
        </asp:Menu>
      </div>
   </div> 

   </div>
   </form>
   </body>
   </html>

Спасибо.

1 Ответ

0 голосов
/ 16 августа 2011

Прозрачные PNG - это поддерживаемая функция IE 7. Вы можете избавиться от этого вызова DXImageTransform и просто обработать его в css, как и в других браузерах.

Единственная причина иметь ссылку на DXImageTransform - это поддержка IE 6;который стал небольшим процентом от обычной пользовательской базы (менее 2% и падает каждый месяц).

Дополнительная информация: http://www.atalasoft.com/cs/blogs/davidcilley/archive/2007/03/14/ie7-dximagetransform-and-png-transparency-problem.aspx

http://blogs.msdn.com/b/ie/archive/2005/04/26/412263.aspx

...