как сделать абсолютную кнопку при достижении нижнего колонтитула Bootstrap Affix - PullRequest
Новая
       12

как сделать абсолютную кнопку при достижении нижнего колонтитула Bootstrap Affix

0 голосов
/ 17 февраля 2020

Я создал кнопку в правом нижнем углу экрана и нижний колонтитул в нижней части экрана, и я установил ее положение кнопки: исправлено. Я хочу изменить положение на абсолютное при прокрутке вниз, чтобы добраться до нижнего колонтитула мой css: 

.affix-top {
    position:fixed;
}
.affix {
    position:absolute;

}

мой сценарий: 

$("#myBtn").affix({
        offset: {
            top: $("#footer").outerHeight(true),
            bottom: null
        }
    });

мой нижний колонтитул: 

<footer class="footer" id="footer">
    <div class="container">
        <div class="row">
            <div class="col-sm-3">
                <h4 class="title">KYK Restaurant ★</h4>
                <p>THE BEST Delivery Restaurants - ★★★★★</p>
            </div>
    </div>
</div>

1 Ответ

0 голосов
/ 18 февраля 2020

1) Добавьте data-spy = ”affix” к div, который вы хотите исправить в правой части. Также добавьте класс в div, в примере я добавил класс как my-affix-div. Затем добавьте приведенный ниже код Javascript. в js: 

$('.my-affix-div').affix(
   {offset:{top: 75, bottom: 240}}
);

в css: 

.affix-bottom{
    position: absolute;
    right: 0;  
}
.affix-top{
    position: absolute;
    right: 0;  
}
.affix {
        top: 200px;
        right: 0;  

 }
...