ارسال پاسخ 
 
امتیاز موضوع:
  • 0 رأی - میانگین امتیازات: 0
  • 1
  • 2
  • 3
  • 4
  • 5
منو آبشاری بسیار حرفه ای
نویسنده پیام
senator آفلاین
محمد رضا چاوشی
****
پاسخگو

ارسال‌ها: 90
تاریخ عضویت: بهم ۱۳۹۲
اعتبار: 20
سپاس ها : 268
 سپاس شده 133 بار در 67 ارسال
ارسال: #1
منو آبشاری بسیار حرفه ای
سلام خدمت همه ی دوستان

خب امروز تو نت ی منوی آبشاری بسیار زیبا پیدا کردم ک گفتم بذارم امیداروم خوشتون بیاد واقعا زیباست

نوسنده:بزودی

مترجم:senator


[hide]اول فایل دانلود و تو هاست خودتون آپ کنید
http://www.shokolati.net/upload/do.php?id=178

بعد این کد هر جایی ک خواستید بذارید
کد php:
<!DOCTYPE html>

<
html>
<
head>
    <
title>CSS3 dropdown menu mybbskin</title>
    <
script type="text/javascript" src="jscripts/ajaxlibs.js"></script>
    <script type="text/javascript">
        $(function() {
          if ($.browser.msie && $.browser.version.substr(0,1)<7)
          {
            $('li').has('ul').mouseover(function(){
                $(this).children('ul').show();
                }).mouseout(function(){
                $(this).children('ul').hide();
                })
          }
        });        
    </script>
    
<style>
body
{
    width: 960px;
    margin: 40px auto;
}

/* Main menu */

#menu
{
    width: 100%;
    margin: 0;
    padding: 10px 0 0 0;
    list-style: none;  
    background: #111;
    background: -moz-linear-gradient(#444, #111); 
    background: -webkit-gradient(linear,left bottom,left top,color-stop(0, #111),color-stop(1, #444));    
    background: -webkit-linear-gradient(#444, #111);    
    background: -o-linear-gradient(#444, #111);
    background: -ms-linear-gradient(#444, #111);
    background: linear-gradient(#444, #111);
    -moz-border-radius: 50px;
    border-radius: 50px;
    -moz-box-shadow: 0 2px 1px #9c9c9c;
    -webkit-box-shadow: 0 2px 1px #9c9c9c;
    box-shadow: 0 2px 1px #9c9c9c;
}

#menu li
{
    float: left;
    padding: 0 0 10px 0;
    position: relative;
    line-height: 0;
}

#menu a 
{
    float: left;
    height: 25px;
    padding: 0 25px;
    color: #999;
    text-transform: uppercase;
    font: bold 12px/25px Arial, Helvetica;
    text-decoration: none;
    text-shadow: 0 1px 0 #000;
}

#menu li:hover > a
{
    color: #fafafa;
}

*html #menu li a:hover /* IE6 */
{
    color: #fafafa;
}

#menu li:hover > ul
{
    display: block;
}

/* Sub-menu */

#menu ul
{
    list-style: none;
    margin: 0;
    padding: 0;    
    display: none;
    position: absolute;
    top: 35px;
    left: 0;
    z-index: 99999;    
    background: #444;
    background: -moz-linear-gradient(#444, #111);
    background: -webkit-gradient(linear,left bottom,left top,color-stop(0, #111),color-stop(1, #444));
    background: -webkit-linear-gradient(#444, #111);    
    background: -o-linear-gradient(#444, #111);    
    background: -ms-linear-gradient(#444, #111);    
    background: linear-gradient(#444, #111);
    -moz-box-shadow: 0 0 2px rgba(255,255,255,.5);
    -webkit-box-shadow: 0 0 2px rgba(255,255,255,.5);
    box-shadow: 0 0 2px rgba(255,255,255,.5);    
    -moz-border-radius: 5px;
    border-radius: 5px;
}

#menu ul ul
{
  top: 0;
  left: 150px;
}

#menu ul li
{
    float: none;
    margin: 0;
    padding: 0;
    display: block;  
    -moz-box-shadow: 0 1px 0 #111111, 0 2px 0 #777777;
    -webkit-box-shadow: 0 1px 0 #111111, 0 2px 0 #777777;
    box-shadow: 0 1px 0 #111111, 0 2px 0 #777777;
}

#menu ul li:last-child
{   
    -moz-box-shadow: none;
    -webkit-box-shadow: none;
    box-shadow: none;    
}

#menu ul a
{    
    padding: 10px;
    height: 10px;
    width: 130px;
    height: auto;
    line-height: 1;
    display: block;
    white-space: nowrap;
    float: none;
    text-transform: none;
}

*html #menu ul a /* IE6 */
{    
    height: 10px;
}

*:first-child+html #menu ul a /* IE7 */
{    
    height: 10px;
}

#menu ul a:hover
{
    background: #0186ba;
    background: -moz-linear-gradient(#04acec,  #0186ba);    
    background: -webkit-gradient(linear, left top, left bottom, from(#04acec), to(#0186ba));
    background: -webkit-linear-gradient(#04acec,  #0186ba);
    background: -o-linear-gradient(#04acec,  #0186ba);
    background: -ms-linear-gradient(#04acec,  #0186ba);
    background: linear-gradient(#04acec,  #0186ba);
}

#menu ul li:first-child > a
{
    -moz-border-radius: 5px 5px 0 0;
    border-radius: 5px 5px 0 0;
}

#menu ul li:first-child > a:after
{
    content: '';
    position: absolute;
    left: 30px;
    top: -8px;
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 8px solid #444;
}

#menu ul ul li:first-child a:after
{
    left: -8px;
    top: 12px;
    width: 0;
    height: 0;
    border-left: 0;    
    border-bottom: 5px solid transparent;
    border-top: 5px solid transparent;
    border-right: 8px solid #444;
}

#menu ul li:first-child a:hover:after
{
    border-bottom-color: #04acec; 
}

#menu ul ul li:first-child a:hover:after
{
    border-right-color: #04acec; 
    border-bottom-color: transparent;     
}


#menu ul li:last-child > a
{
    -moz-border-radius: 0 0 5px 5px;
    border-radius: 0 0 5px 5px;
}

/* Clear floated elements */
#menu:after 
{
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}

* html #menu             { zoom: 1; } /* IE6 */
*:first-child+html #menu { zoom: 1; } /* IE7 */
</style>

<!-- AdPacks -->
<style>
#adpacks-wrapper{font-family: Arial, Helvetica;width:280px;position: fixed;_position:absolute;bottom: 0;right: 20px;z-index: 9999;background: #eaeaea;padding: 10px;-moz-box-shadow: 0 0 15px #444;-webkit-box-shadow: 0 0 15px #444;box-shadow: 0 0 15px #444;}
body .adpacks{background:#fff;padding:15px;margin:15px 0 0;border:3px solid #eee;}
body .one .bsa_it_ad{background:transparent;border:none;font-family:inherit;padding:0;margin:0;}
body .one .bsa_it_ad .bsa_it_i{display:block;padding:0;float:left;margin:0 10px 0 0;}
body .one .bsa_it_ad .bsa_it_i img{padding:0;border:none;}
body .one .bsa_it_ad .bsa_it_t{padding: 0 0 6px 0; font-size: 11px;}
body .one .bsa_it_p{display:none;}
body #bsap_aplink,body #bsap_aplink:hover{display:block;font-size:9px;margin: -15px 0 0 0;text-align:right;}
body .one .bsa_it_ad .bsa_it_d{font-size: 11px;}
body .one{overflow: hidden}
</style>

</head>
<body>
    
<ul id="menu">
    <li><a href="http://shokolati.net/">خانه</a></li>
    <li>
        <a href="#">Categories</a>
        <ul>
            <li>
                <a href="#">CSS</a>
                <ul>
                    <li><a href="#">Item 11</a></li>
                    <li><a href="#">Item 12</a></li>
                    <li><a href="#">Item 13</a></li>
                    <li><a href="#">Item 14</a></li>
                </ul>                
            </li>
            <li>
                <a href="#">Graphic design</a>
                <ul>
                    <li><a href="#">Item 21</a></li>
                    <li><a href="#">Item 22</a></li>
                    <li><a href="#">Item 23</a></li>
                    <li><a href="#">Item 24</a></li>
                </ul>                
            </li>
            <li>
                <a href="#">Development tools</a>
                <ul>
                    <li><a href="#">Item 31</a></li>
                    <li><a href="#">Item 32</a></li>
                    <li><a href="#">Item 33</a></li>
                    <li><a href="#">Item 34</a></li>
                </ul>                
            </li>
            <li>
                <a href="#">Web design</a>                
                <ul>
                    <li><a href="#">Item 41</a></li>
                    <li><a href="#">Item 42</a></li>
                    <li><a href="#">Item 43</a></li>
                    <li><a href="#">Item 44</a></li>
                </ul>    
            </li>
        </ul>
    </li>
    <li>
        <a href="#">متن</a>
        <ul>
            <li>
                <a href="#">متن</a>
                <ul>
                    <li>
                        <a href="#">متن</a>        
                        <ul>
                            <li>
                                <a href="#">متن</a>                        
                            </li>
                            <li>
                                <a href="#">متن</a>
                            </li>
                            <li>
                                <a href="#">متن</a>
                            </li>
                        </ul>                            
                    </li>
                    <li>
                        <a href="#">متن</a>
                        <ul>
                            <li>
                                <a href="#">متن</a>                        
                            </li>
                            <li>
                                <a href="#">متن</a>
                            </li>
                            <li>
                                <a href="#">متن</a>
                            </li>
                        </ul>                            
                    </li>
                    <li>
                        <a href="#">متن</a>
                        <ul>
                            <li>
                                <a href="#">متن</a>                        
                            </li>
                            <li>
                                <a href="#">متن</a>
                            </li>
                            <li>
                                <a href="#">متن</a>
                            </li>
                        </ul>                            
                    </li>
                </ul>                    
            </li>
            <li>
                <a href="#">متن</a>
                <ul>
                    <li>
                        <a href="#">متن</a>
                        <ul>
                            <li>
                                <a href="#">متن</a>                        
                            </li>
                            <li>
                                <a href="#">متن</a>
                            </li>
                            <li>
                                <a href="#">متن</a>
                            </li>
                        </ul>                            
                    </li>
                    <li>
                        <a href="#">متن</a>
                        <ul>
                            <li>
                                <a href="#">متن</a>                        
                            </li>
                            <li>
                                <a href="#">متن</a>
                            </li>
                            <li>
                                <a href="#">متن</a>
                            </li>
                        </ul>                            
                    </li>
                    <li>
                        <a href="#">متن</a>
                        <ul>
                            <li>
                                <a href="#">متن</a>                        
                            </li>
                            <li>
                                <a href="#">متن</a>
                            </li>
                            <li>
                                <a href="#">متن3</a>
                            </li>
                        </ul>                            
                    </li>
                </ul>                    
            </li>
            <li>
                <a href="#">متن</a>
                <ul>
                    <li>
                        <a href="#">متن/a>
                        <ul>
                            <li>
                                <a href="#">متن</a>                        
                            </li>
                            <li>
                                <a href="#">متن</a>
                            </li>
                            <li>
                                <a href="#">متن</a>
                            </li>
                        </ul>                            
                    </li>
                    <li>
                        <a href="#">متن</a>
                        <ul>
                            <li>
                                <a href="#">متن</a>                        
                            </li>
                            <li>
                                <a href="#">متن</a>
                            </li>
                            <li>
                                <a href="#">متن</a>
                            </li>
                        </ul>                            
                    </li>
                    <li>
                        <a href="#">متن</a>
                        <ul>
                            <li>
                                <a href="#">متن</a>                        
                            </li>
                            <li>
                                <a href="#">متن</a>
                            </li>
                            <li>
                                <a href="#">متن</a>
                            </li>
                        </ul>                            
                    </li>
                </ul>                    
            </li>
        </ul>        
    </li>
    <li>
        <a href="#">About</a>    
    </li>
    <li>
        <a href="#">Contact</a>    
    </li>
</ul>

<br><br><br>
<Center><a href="http://www.mybbskin.i/">mybbskin.ir</a><Center>
</div>

</body>
<div style="visibility:hidden;display:none">
<a href="http://mybbskin.i">http://mybbskin.i</a>
<div> 
</html> 
[/hide]

نکته:اول کد و تو نت پد بذارید

[تصویر:  home.png]نمونه:
[تصویر:  do.php?img=179]

موفق باشید

[تصویر:  13976667931.gif]

اگر روزی دشمن پیدا کردی، بدان که در رسیدن به هدفت موفق بودی.
اگر روزی تهدیتت کردند، بدان در برابرت ناتوانند.
اگر روزی خیانت دیدی، بدان قیمتت بالاست.
اگر روزی ترکت کردند، بدان با تو بودن لیاقت میخواهد.
۱۹-۱۲-۱۳۹۲ ۰۶:۴۳ عصر
مشاهده‌ی وب‌سایت کاربر یافتن تمامی ارسال‌های این کاربر نقل قول این ارسال در یک پاسخ
Hossein121 آفلاین
محمدحسین فراهانی
******
معاونت سایت

ارسال‌ها: 1,396
تاریخ عضویت: فرو ۱۳۹۱
اعتبار: 1118
سپاس ها : 1088
 سپاس شده 1451 بار در 389 ارسال
ارسال: #2
RE: منو آبشاری بسیار حرفه ای
درود.
انتقال یافت.
خسته نباشید.

[مهم] قوانین مای بی بی اسکین
[ویژه] همکاری با تیم مای بی بی اسکین

ما فراموش شدگانیم جز نعره سلاحی نیست...

لطفا به هیچ وجه از مدیران در پیام خصوصی درخواست کمک نکنید و یا سوال نپرسید.
۱۹-۱۲-۱۳۹۲ ۰۸:۴۴ عصر
مشاهده‌ی وب‌سایت کاربر یافتن تمامی ارسال‌های این کاربر نقل قول این ارسال در یک پاسخ
ارسال پاسخ 


موضوع‌های مرتبط با این موضوع...
موضوع: نویسنده پاسخ: بازدید: آخرین ارسال
  کد پنجره مزاحم بسیار زیبا برای کاربر مهمان ( جدید ) SheRvin 7 1,377 ۱۰-۱۲-۱۳۹۱ ۰۴:۰۰ عصر
آخرین ارسال: Dina
  آموزش قرار دادن اهنگ مورد علاقه بسیار زیبا وجدید !!! Hidden !!! 6 1,336 ۱۳-۸-۱۳۹۱ ۰۳:۰۷ صبح
آخرین ارسال: !!! Hidden !!!
  آموزش ایجاد منو آبشاری ::‌ درختی SheRvin 14 2,717 ۶-۸-۱۳۹۱ ۰۵:۲۸ عصر
آخرین ارسال: mkkh
  کد پنجره مزاحم بسیار زیبا برای کاربر مهمان SheRvin 4 867 ۲۹-۲-۱۳۹۱ ۱۰:۴۵ صبح
آخرین ارسال: SheRvin

پرش به انجمن:


کاربرانِ درحال بازدید از این موضوع: 1 مهمان

خانه | بازگشت به بالا | بازگشت به محتوا | نسخه موبایل | پیوند سایتی RSS
اخبار فناوری اطلاعات | نرم افزار املاک | نرم افزار دامپزشکی | هتل آپارتمان مشهد | ترجمه تخصصی | نرم افزار داروخانه | نرم افزار رستوران | نرم افزار تاکسی سرویس | نرم افزار رستوران | دانلود نرم افزار مطب | دانلود نرم افزار تاکسی سرویس | مجله پزشکی آسان طب | دکتر آسان طب | کنکور آسان است | نرم افزار دفترچه تلفن نرم افزار چاپ چک نرم افزار رستوران نرم افزار فست فود نرم افزار کافی شاپ نرم افزار تاکسی سرویس نرم افزار نمایشگاه خودرو نرم افزار املاک نرم افزار هتلداری نرم افزار مطب نرم افزار دندانپزشکی نرم افزار انبارداری نرم افزار حسابداری فروشگاه نرم افزار وکالت بهترین سایت تفریحی | مجله اینترنتی پارسی وان | مجله اینترنتی زیگیل | خرید بک لینک | خرید رپورتاژ | سینما تئاتر مای استیج | یک مهاجر | دنیای مهاجرت | مجله گردشگری کاروان | وردپرس دانلود | مجله تفریحی تندیس فان | نرم افزار | جوک جدید | اخبار هنر | اخبار کامپیوتر | سایت پزشکی | فروشگاه اینترنتی | سایت خبری | دانلود موزیک | اندروید سه | بانک شماره موبایل | پایگاه صالحین | مجله کامپیوتری | جاب لر | سهام نت | تکی کو | تم کد | مجله خانواده | مجله اینترنتی وبدون | پورتال خبری | سایت تفریحی تک لایو | مجله سرگرمی سیب رنک | سایت پزشکی دکتر طب | خرید گیفت کارت | مدرن بوک | تولید کننده روغن زیتون ماشین آلات صنایع غذایی تولید کننده جعبه و کارتن تولید کننده ادویه