получить нижнюю позицию экрана

Question

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

Answer 1

Если я правильно понял ваш вопрос, вы готовы иметь максимальную высоту контейнера. Давайте сделаем это на примере. Предположим, что у вас есть главный DIV container, который окружает все еще, p тег, чтобы показать текущий размер container для отображения цели и button, чтобы показать и скрыть banner:

HTML

<div class="container"> 
    Screen size is <p></p> 
    <button type="button">push to add banner</button> 
</div> 

для того, чтобы изменить высоту container в зависимости от высоты окна, мы можем сделать это в JQuery:

$(document).ready(function() { 

    heightResize($(".container")); 

    $(window).resize(function() { 
    heightResize($(".container")); 
    }); 
}); 

function heightResize(element) { 
    element.height($(window).height()-20); 
    $("p").text(element.height()); 
} 

Затем код, чтобы показать/скрыть баннер и изменить высоту container соответственно:

$("button").click(function() { 

    if ($(".container").find(".banner").length != 0) { 
    $(".container").find(".banner").remove(); 
    heightResize($(".container")); 
    } else { 
    $(".container").append("<div class='banner'>this is your dynamically created banner</div>"); 
    $(".container").height($(".container").height()+$(".banner").height()); 
    } 

}); 

Когда banner добавляется динамически, высота container будет расти больше, чем высота window столько, сколько высоты banner.

Заканчивать рабочий пример в CODEPEN