Показать/скрыть div со свитком, начиная со дна страницы

Я использую этот код, чтобы показать/скрыть div при прокрутке веб-сайта. Моя проблема заключается в том, что div появляется, когда, например, div #top достигает верхней части окна браузера. Мне нужно, чтобы .news div появлялся, когда div #top начинает отображаться в нижней части окна браузеров и исчезает таким же образом.Показать/скрыть div со свитком, начиная со дна страницы

$(document).ready(function() { 
    var topOfOtheDiv3 = $("#top").offset().top; 
    var topOfOtheDiv4 = $("#bottom").offset().top; 
    $(window).scroll(function() { 
     if ($(window).scrollTop() > topOfOtheDiv3 && $(window).scrollTop() < topOfOtheDiv4) { 
      $(".news").show(); 
     } else { 
      $(".news").hide(); 
     } 
    }); 
});

Вот скрипка я нашел http://jsfiddle.net/4r5kn/10/ Зеленый ящик должен появиться, когда синий начинает появляться из нижней части страницы.

источник

2013-09-12 Sebastian Smith

вы также можете разделить разметку, а предпочтительно - создать пример скрипки? –

Только секунду я получил ответ для вас – skmasq

Эй, но все работает как ожидалось ... по крайней мере, наблюдая за своей скрипкой, все работает. Не могли бы вы быть более ясными, что является главной проблемой, я не могу понять. – skmasq

Вы также должны учитывать высоту окна. У меня есть updated the fiddle. Изменение заключается в вычитании высоты окна от topOfOthDiv и topOfOthDiv2 переменных.

$(document).ready(function() { 
    var topOfOthDiv = $("#othdiv").offset().top - $(window).height(); 
    var topOfOthDiv2 = $("#othdiv2").offset().top - $(window).height(); 

    $(window).scroll(function() { 
     var winTop = $(window).scrollTop(); 
     if (winTop > topOfOthDiv && winTop < topOfOthDiv2) { 
      $("#dvid").show(); 
     } else { 
      $("#dvid").hide(); 
     } 
    }); 
});

источник

2013-09-12 04:25:17

Необходимо добавить к этому свое окно. Это позволит сделать так, чтобы верхняя часть DIV + высоты окна должно быть в виде первый:

Вот скрипка: http://jsfiddle.net/4r5kn/14/

Я просто добавил var winHeight = $(window).height(); в код,
добавил это к заявлению if if ($(window).scrollTop()+winHeight > topOfOthDiv && $(window).scrollTop()+winHeight < topOfOthDiv2) {
а затем вуаля.

Таким образом, если вам нужно вообще изменить или настроить высоту (скажем, вы хотите, чтобы она показывалась, когда нижняя часть div находится в поле зрения внизу страницы), вы можете добавить эту величину пикселя на ваш winHeight переменная

источник

2013-09-12 04:27:59 ntgCleaner

Показать/скрыть div со свитком, начиная со дна страницы

ответ

Смежные вопросы