Плавающий блок с помощью jQuery

Тема в разделе "JavaScript", создана пользователем judex, 13 окт 2013.

Модераторы: ZiX
  1. judex

    judex

    Регистр.:
    23 дек 2006
    Сообщения:
    234
    Симпатии:
    72
    Сделал на сайте плавающий блок с помощью jQuery таким образом

    HTML:
    <div class="floating">  
    <div>Блок</div>
    </div>
    Код:
        $(function() {
            var offset = $(".floating").offset();
            var topPadding = 15;
            $(window).scroll(function() {
                if ($(window).scrollTop() > offset.top) {
                    $(".floating").stop().animate({marginTop: $(window).scrollTop() - offset.top + topPadding});
                }
                else {$(".floating").stop().animate({marginTop: 0});};});
        });
    И столкнулся с такой проблемой, когда браузер доходит до футера он его сдвигает вниз. Подскажите пожалуйста как зафиксировать блок, чтобы доходя до футера он прокручивался вверх?
     
  2. BDSG

    BDSG

    Регистр.:
    28 фев 2009
    Сообщения:
    203
    Симпатии:
    109
    видимо добавить какой-нибудь bottomPadding со значением высоты футера, и по аналогии с отграничением прокрутки от верха, сделать ограничение от низа..
     
  3. Son1K

    Son1K Создатель

    Регистр.:
    19 апр 2006
    Сообщения:
    36
    Симпатии:
    10
    HTML:
        $().ready(function() {
            var $scrollingDiv = $("#scrollingDiv");
            $(window).scroll(function(){           
                $scrollingDiv
                    .stop()
                    .animate({"marginTop": ($(window).scrollTop() + 30) + "px"}, "slow" );           
            });
        });
    у меня стоит с таким кодом. Футер не сдвигает, работает корректно. Попробуйте.