منویی که با پایین آمدن کاربر شناور بشه؟

[Mohammad-tashi 11]

باسلام

بارها توی سایت ها دیدم که چطور یعنی از سایت ها یه گزینه ای(المانی) برای وسط های صفحه در نظر میگیرند و اسکرول که پایین میاد اون المان هم کنده میشه و با کاربر حرکت میکنه

میخاستم بدونم چطور این کار انجام میشه؟

[محمدحسین میری 3,094]

درود بر شما

 

یه پلاگین جی کوئری هست

متسفانه امکان جستجو ندارم اما یکمی بگردید حتما پیدا می کنید این پلاگین خیلی معروفه و زود پیدا میشه

[رضاقاسمی 1,539]

البته میتونید یه div هم با css بسازید و position اش رو روی fixed تنظیم کنید و فاصله از راست رو 0 بدید فاصله از بالا رو هم به دلخواه تنظیم کنید.

[Mohammad-tashi 11]

البته میتونید یه div هم با css بسازید و position اش رو روی fixed تنظیم کنید و فاصله از راست رو 0 بدید فاصله از بالا رو هم به دلخواه تنظیم کنید.

ممنون بابت پاسختون

اما بیشتر مد نظرمم همون منویی است که با حرکت کاربر بشه فرستادش ته صفحه

[m4mali 478]

نمونه :

 

HTML

<div id="main-menu-container">
    <div id="main-menu">
        //your menu
    </div>
</div>
--------------------------------------------------------------
CSS
.f-nav{  /* To fix main menu container */
    z-index: 9999;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
}
#main-menu-container {
    text-align: center; /* Assuming your main layout is centered */
}
#main-menu {
    display: inline-block;
    width: 1024px; /* Your menu's width */
}
-------------------------------------------------------------
JS
 
$("document").ready(function($){
    var nav = $('#main-menu-container');

    $(window).scroll(function () {
        if ($(this).scrollTop() > 125) {
            nav.addClass("f-nav");
        } else {
            nav.removeClass("f-nav");
        }
    });
});

 

بهتر از این هم میشه البته.

برای افراد دنبال سوژه این پست 666 بود

ویرایش شده اردیبهشت 94 توسط تیرداد

[Mohammad-tashi 11]

نمونه :

 

HTML

<div id="main-menu-container">
    <div id="main-menu">
        //your menu
    </div>
</div>
--------------------------------------------------------------
CSS
.f-nav{  /* To fix main menu container */
    z-index: 9999;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
}
#main-menu-container {
    text-align: center; /* Assuming your main layout is centered */
}
#main-menu {
    display: inline-block;
    width: 1024px; /* Your menu's width */
}
-------------------------------------------------------------
JS
 
$("document").ready(function($){
    var nav = $('#main-menu-container');

    $(window).scroll(function () {
        if ($(this).scrollTop() > 125) {
            nav.addClass("f-nav");
        } else {
            nav.removeClass("f-nav");
        }
    });
});

 

بهتر از این هم میشه البته.

برای افراد دنبال سوژه این پست 666 بود

باتشکر از شما

فقط الان یه سوالی من دارم

من یک باکس دارم

که توش هم منو لود میشه هم باکس سرچ

میخام اگه کاربر اومد پایین این نواز کلا بچسبه به پایین صفحه

برای اینکار چیکارکنم؟

[m4mali 478]

باتشکر از شما

فقط الان یه سوالی من دارم

من یک باکس دارم

که توش هم منو لود میشه هم باکس سرچ

میخام اگه کاربر اومد پایین این نواز کلا بچسبه به پایین صفحه

برای اینکار چیکارکنم؟

 

فرقی نمی کنه کافیه که id اون باکس (div) رو بدین .

 

تو این قسمت

 var nav = $('#main-menu-container');