Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Плавающий блок, замирающий над футером (https://javascript.ru/forum/dom-window/43757-plavayushhijj-blok-zamirayushhijj-nad-futerom.html)

рони 23.11.2014 06:12

anmast,
:blink:

sergiocharm 25.11.2014 22:56

рони,
при заужении браузера блок не останавливается и лезет до бесконечности. как в этом случае поступить?

рони 26.11.2014 10:31

sergiocharm,
:) ещё вариант
$(function() {
      var elem = $("#fixed"), h = elem.offset().top ;
	  $(window).scroll(function(){
      var top = $(this).scrollTop();
      elem.css( {'top': top> h ? 20 : '', 'position': top > h ?   'fixed' : ''})})
 });

sergiocharm 27.11.2014 17:55

Спасибо! Поступил проще, убрал при маленьком разрешении

Jeff 06.09.2015 14:14

Вот пример, как сделать плавающий блок ;)

рони 06.09.2015 15:21

Цитата:

Сообщение от Jeff
Вот пример, как сделать плавающий блок

тема Плавающий блок, замирающий над футером
:-?

BETEPAH 06.09.2015 17:07

Jeff,
и не очень хорошая реализация. Если после загрузки страницы изменится смещение до "плавающего" блока (подгрузится что-то выше него, отобразится картинка, изменится ориентация экрана...) блок будет фиксироваться в неправильном положении скролла.

sergiocharm 28.01.2016 09:32

Цитата:

Сообщение от рони (Сообщение 342321)
sergiocharm,
$(function() {
     var offset = $("#fixed").offset();
     var topPadding = 20,
         bottomPadding = 210; //высота над которой остоновится
     $(window).scroll(function() {
         if ($(window).scrollTop() > offset.top) {
             if ($(document).height() - bottomPadding > $(window).scrollTop() + $("#fixed").height()) $("#fixed").stop().animate({
                 marginTop: $(window).scrollTop() - offset.top + topPadding
             });
         } else {
             $("#fixed").stop().animate({
                 marginTop: 0
             });
         };
     });

 });

Подскажите как остановить блок если окно браузера сужается и блок становится под текстом и не может дотянуться до футера? http://www.allremont59.ru/building-h...nt-stena-fasad

рони 28.01.2016 19:23

sergiocharm,
попробуйте так
$(function() {
    var offset = $("#fixed").offset();
    var topPadding = 20,
        bottomPadding = 210;
    $(window).scroll(function() {
        var max = $(document).height() - ($(window).height() - bottomPadding),
            scroll = $(window).scrollTop();
        if (scroll > offset.top && scroll < max) {
            if ($(document).height() - bottomPadding > scroll + $("#fixed").height()) $("#fixed").stop().animate({
                marginTop: scroll - offset.top + topPadding
            })
        } else $("#fixed").stop().animate({
            marginTop: 0
        })
    })
});

рони 29.01.2016 18:05

sergiocharm,
jQuery Plugin For Creating Sticky Elements While Scrolling


Часовой пояс GMT +3, время: 22:53.