Могу ли я создать динамические элементы меню Asp.Net, отображающие внешний родительский DIV без использования позиции: абсолютный?

-1

я имею проблему, что динамические пункты меню находятся внутри контейнера DIV, а мне нужно, чтобы сделать их показать за его пределами без необходимости использования абсолютного в меню asp.netМогу ли я создать динамические элементы меню Asp.Net, отображающие внешний родительский DIV без использования позиции: абсолютный?

Главное, что Asp.Net Menu обрезается, поэтому остальная часть динамической части меню не отображается пользователю, потому что она скрыта внутри

Надеюсь, вы понимаете код и предлагаете некоторые решения проблемы Спасибо за любое усилие

<!-- language: lang-html --> 

     <!DOCTYPE html> 

     <html xmlns="http://www.w3.org/1999/xhtml" dir="rtl"> 
      <head runat="server"> 
       <link href="StyleSheet/MainStyleSheet.css" rel="stylesheet" /> 
       <link href="Content/themes/base/all.css" rel="stylesheet" /> 
       <link href="Content/themes/smoothness/jquery-ui.smoothness.css" rel="stylesheet" /> 
       <link href="StyleSheet/jquery-ui-timepicker-addon.css" rel="stylesheet" /> 

       <script src="Scripts/jquery-2.1.3.js"></script> 
       <script src="Scripts/jquery-ui-1.11.4.js"></script> 
       <script src="Scripts/jquery.ui.datepicker-ar.js"></script> 
       <script src="Scripts/jquery-ui-timepicker-addon.js"></script> 

    <style type="text/css"> 
     html,body, form { 
      font-family: AmiriWeb, 'Amiri QuranWeb', Amiri, Arial; 
      direction: rtl; 
      overflow-x: hidden; 
     } 

     input, textarea, select { 
      font-family: AmiriWeb, 'Amiri QuranWeb', Amiri, Arial; 
      direction: rtl; 
     } 

     .Container { 
      width: 1000px; 
      margin: 0px auto; 
      direction: rtl; 
      overflow: hidden; 
     } 

     .TdGeneralStyle { 
      padding: 10px 10px 10px 10px; 
     } 

     .AdminMenuStyle{ 
      background-color: black; 
     } 

     .AdminMenuStyle a{ 
      color: lightgreen; 
      display: block; 
      font-weight: bold; 
      padding: 10px; 
      width: 100%; 
      background-position: 14% center !important; 
     } 

     .AdminMenuStyle ul, .AdminMenuStyle li{ 
      background-color: black; 
      border: 1px solid #F75D59; 
     } 
     .AdminMenuStyle ul:hover, .AdminMenuStyle li:hover{ 
      background-color: #F75D59; 
     } 

     .AdminStaticMenuStyle{ 
      width: 100% !important; 
     } 

     .AdminDynamicMenuStyle{ 
      width: 180px !important; 
     } 
    </style> 
      </head> 
      <body> 
       <form id="form1" runat="server"> 
        <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager> 
        <div class="Container"> 
         <table style="border: 5px solid green; border-collapse: collapse; width: 100%;"> 
       <tr style="background-color: green; "> 
        <td style="width: 20%; color: yellow; font-weight: bold; " class="TdGeneralStyle">إسم المستخدم </td> 
        <td style="width: 80%; " class="TdGeneralStyle"></td> 

       </tr> 
       <tr> 
        <td style="width: 20%; background-color: black; vertical-align: top;"> 
         <asp:Menu ID="Menu1" CssClass="AdminMenuStyle" Width="100%" runat="server" StaticPopOutImageUrl="~/AppItems/AppImages/PalFlagIconMenu.png" DynamicPopOutImageUrl="~/AppItems/AppImages/PalFlagIconMenu.png" MaximumDynamicDisplayLevels="5"> 
          <DynamicMenuStyle CssClass="AdminDynamicMenuStyle" /> 
          <Items> 
           <asp:MenuItem Text="المقالات" Value="المقالات"> 
            <asp:MenuItem Text="جديد" Value="جديد" NavigateUrl="~/Admin/ArticlesAdmin/AddArticle.aspx"></asp:MenuItem> 
            <asp:MenuItem Text="تعديل" Value="تعديل"></asp:MenuItem> 
            <asp:MenuItem Text="الكاتب" Value="الكاتب"> 
             <asp:MenuItem NavigateUrl="~/Admin/WriterAdmin/AddWriter.aspx" Text="جديد" Value="جديد"></asp:MenuItem> 
             <asp:MenuItem Text="تعديل" Value="تعديل"></asp:MenuItem> 
            </asp:MenuItem> 
           </asp:MenuItem> 
           <asp:MenuItem Text="مستخدم" Value="مستخدم"> 
            <asp:MenuItem Text="جديد" Value="جديد"></asp:MenuItem> 
            <asp:MenuItem Text="تعديل" Value="تعديل"></asp:MenuItem> 
            <asp:MenuItem Text="تغيير الكلمة السرية" Value="تغيير الكلمة السرية"></asp:MenuItem> 
           </asp:MenuItem> 
          </Items> 
          <StaticMenuStyle CssClass="AdminStaticMenuStyle" /> 
         </asp:Menu> 
        </td> 
        <td style="width: 80%; vertical-align: top;" class="TdGeneralStyle" > 
         <asp:ContentPlaceHolder ID="cphDefaultAdminMasterPageBody" runat="server"> 
         </asp:ContentPlaceHolder> 
        </td> 
       </tr> 
       <tr> 
        <td colspan="2" style="border-top: 5px solid green; font-weight: bold; text-align: center; background-color: green; color:yellow;"> 
         2015 
        </td> 
       </tr> 
      </table> 
        </div> 
       </form> 
      </body> 
      </html>

источник

2015-03-16 Final Heaven

решение проблемы меню использует абсолютное только это то, что я есть, и проблема решена:

.AdminMenuStyle { 
    background-color: black; 
    position: absolute; 
} 

    .AdminMenuStyle a { 
     color: lightgreen; 
     display: block; 
     font-weight: bold; 
     padding: 10px; 
     width: 100%; 
     background-position: 14% center !important; 
    } 

    .AdminMenuStyle ul, .AdminMenuStyle li { 
     background-color: black; 
     border: 1px solid #F75D59; 
     width: 100% !important; 
    } 

     .AdminMenuStyle ul:hover, .AdminMenuStyle li:hover { 
      background-color: #F75D59; 
     } 

.AdminStaticMenuStyle { 
} 

.AdminDynamicMenuStyle { 
} 


<script> 
     function fixMenuBackContainerHeight() { 
      var menuObject = $('#<%= mAdminMenu.ClientID %>'); 
      var tdMenuContainer = $('#tdMenuContainer'); 
      var menuHeight = menuObject.height(); 
      tdMenuContainer.css("min-height", menuHeight); 
      menuObject.width(tdMenuContainer.width()); 
     } 

     $(function() { 
      fixMenuBackContainerHeight(); 
     }); 
    </script>

источник

2015-03-21 09:34:58

Могу ли я создать динамические элементы меню Asp.Net, отображающие внешний родительский DIV без использования позиции: абсолютный?

ответ

Смежные вопросы