قائمة منسدلة - EXE and APK

قائمة منسدلة

قائمة منسدلة
    أضافة قائمة منسدلة

    الكود في التخطيط


    <nav id='inv-navigation' itemscope='itemscope' itemtype='http://schema.org/SiteNavigationElement'>
    <div class='maxwrap'>
    <input type="checkbox" />القائمة &#9776;
    <ul>
    <li class='indie'><a expr:href='data:blog.homepageUrl' expr:title='data:blog.title' itemprop='url'><span itemprop='name'>الرئيسة</span></a></li>
    <li><a href='#' itemprop='url'><span itemprop='name'>المدونة</span></a>
    <ul>
    <li><a href='#' itemprop='url'><span itemprop='name'>عن المدونة</span></a></li>
    <li><a href='#' itemprop='url'><span itemprop='name'>اتصل بنا</span></a></li>
    <li><a href='#' itemprop='url'><span itemprop='name'>إخلاء المسؤولية</span></a></li>
    <li><a href='#' itemprop='url'><span itemprop='name'>سياسة الخصوصية</span></a></li>
    <li><a href='#' itemprop='url'><span itemprop='name'>الفهرس</span></a></li>
    <li><a href='#' itemprop='url'><span itemprop='name'>اتفاقية الاستخدام</span></a></li>
    </ul>
    </li>
    <li><a href='#' itemprop='url'><span itemprop='name'>اربح اونلاين</span></a></li>
    <li><a href='#' itemprop='url'><span itemprop='name'>معلومات هامة</span></a></li>
    <li><a href='#' itemprop='url'><span itemprop='name'>انترنت</span></a></li>
    <li><a href='#' itemprop='url'><span itemprop='name'>صحة</span></a></li>
    <li><a href='#' itemprop='url'><span itemprop='name'>التسميات</span></a>
    <ul>
    <li><a href='#' itemprop='url'><span itemprop='name'>عن المدونة</span></a></li>
    <li><a href='#' itemprop='url'><span itemprop='name'>اتصل بنا</span></a></li>
    <li><a href='#' itemprop='url'><span itemprop='name'>إخلاء المسؤولية</span></a></li>
    <li><a href='#' itemprop='url'><span itemprop='name'>سياسة الخصوصية</span></a></li>
    <li><a href='#' itemprop='url'><span itemprop='name'>الفهرس</span></a></li>
    <li><a href='#' itemprop='url'><span itemprop='name'>اتفاقية الاستخدام</span></a></li>
    </ul>
    </li>
    <li><a href='#' itemprop='url'><span itemprop='name'>صفحة خطأ</span></a></li>
    </ul>
    </div>
    </nav>

    الكود قي skin

    /* Main Navigation by Sory Mohajer */
    #inv-navigation{background:#fff;font-size:0;white-space:nowrap;margin:0 auto}
    #inv-navigation ul.menus{height:auto;overflow:hidden;position:absolute;z-index:99;display:none}
    #inv-navigation a{display:block;padding:15px 12px;text-decoration:none;color:#fff}
    #inv-navigation ul,#inv-navigation li{background:#4AA3DF;margin:0 auto;padding:0;list-style:none}
    #inv-navigation li{display:inline-block;position:relative;font-size:14px;font-weight:700;text-align:right;float:right}
    #inv-navigation li.indie a{background:rgba(0,0,0,0.06);padding:15px}
    #inv-navigation li:hover.indie,#inv-navigation li:hover.indie a{background:rgba(0,0,0,.06)}
    #inv-navigation input{display:none;margin:0;padding:0;width:80px;height:45px;opacity:0;cursor:pointer}
    #inv-navigation label{display:none;width:55px;height:48px;line-height:48px;text-align:center}
    #inv-navigation label span{font-size:16px;position:absolute;right:55px}
    #inv-navigation ul.menus li{display:block;width:100%;text-transform:none;text-shadow:none}
    #inv-navigation ul.menus a{color:#ec3838;line-height:55px}
    #inv-navigation li a:hover{background:rgba(0,0,0,.06);color:#fff}
    #inv-navigation ul.menus a:hover{background:rgba(0,0,0,.06);color:#fff}
    #inv-navigation li ul{visibility:hidden;opacity:0;background:#fff;margin:0;width:150px;height:auto;position:absolute;top:100%;right:0;z-index:10;box-shadow:0 4px 15px -2px rgba(0,0,0,0.1)}
    #inv-navigation li:hover ul.menus,#inv-navigation li:hover >
    ul{visibility:visible;opacity:1}
    #inv-navigation li li{display:block;float:none;font-size:13px;border-bottom:1px solid #f5f5f5}
    #inv-navigation li li:last-child{border:0}
    #inv-navigation li ul ul{right:100%;top:0}
    #inv-navigation li li >
    a{background:#fff;color:#999;display:block;padding:7px 15px;margin:0;text-decoration:none;text-transform:none;font-weight:400;border-right:2px solid transparent;transition:background .3s}
    #inv-navigation li li:hover,#inv-navigation li li a:hover{background:#fafafa;color:#444;border-right:2px solid #ccc}
    @media screen and (max-width:800px){
    #menu{display:block}
    #inv-navigation{font-size:initial;color:#888;position:relative;display:block;padding:20px;font-weight:700}
    #inv-navigation ul{background:#fff;position:absolute;top:100%;right:0;z-index:3;height:auto;display:none}
    #inv-navigation ul.menus{width:100%;position:static;padding-right:20px}
    #inv-navigation li{background:#fff;display:block;float:none;width:auto}
    #inv-navigation a,#inv-navigation li a:hover{color:#444}
    #inv-navigation li.indie a{background:#fff;padding:7px 12px}
    #inv-navigation input,#inv-navigation label{position:absolute;top:0;right:0;display:block}
    #inv-navigation input{z-index:4}
    #inv-navigation input:checked + label{color:#888}
    #inv-navigation input:checked ~ ul{display:block;width:100%}
    #inv-navigation li:hover >  ul{width:100%}
    #inv-navigation li li{border:0}
    #inv-navigation li li >  a{background:#f9f9f9;color:#888;transition:initial;font-weight:700}
    #inv-navigation li li:hover,#inv-navigation li li a:hover{background:#bbb;color:#fff;box-shadow:inset 3px 0 0 transparent}
    #inv-navigation li ul{background:rgba(0,0,0,.15);display:block;visibility:visible;opacity:1;padding:0;position:relative;width:100%;right:initial;box-shadow:none}
    #inv-navigation li:hover ul.menus,#inv-navigation li:hover >  ul{right:initial}
    }
    عن الموضوع
    قائمة منسدلة
  • جميع الحقوق محفوظة : ( اتفاقية نقل المحتوى )
  • للإبلاغ عن رابط معطوب : اضغط هنا
  • إرسال تعليق

    English French German Spain Italian Dutch Russian Portuguese Japanese Korean Arabic Chinese Simplified