Quiero colocar un elemento en la parte inferior de la página cada vez que el usuario se desplaza por la página. Es como "posición fija" pero no puedo usar "posición: fija" css ya que muchos de los navegadores de mis clientes no lo admiten.
Noté que jquery puede obtener la posición superior de la ventana gráfica actual, pero ¿cómo puedo obtener la parte inferior de la ventana gráfica de desplazamiento?
Así que estoy preguntando cómo saber: $(window).scrollBottom()
var scrollBottom = $(window).scrollTop() + $(window).height();
Diría que un scrollBottom como opuesto directo de scrollTop debería ser:
var scrollBottom = $(document).height() - $(window).height() - $(window).scrollTop();Aquí hay una pequeña prueba fea que funciona para mí:
// SCROLLTESTER START // $('<h1 id="st" style="position: fixed; right: 25px; bottom: 25px;"></h1>').insertAfter('body'); $(window).scroll(function () { var st = $(window).scrollTop(); var scrollBottom = $(document).height() - $(window).height() - $(window).scrollTop(); $('#st').replaceWith('<h1 id="st" style="position: fixed; right: 25px; bottom: 25px;">scrollTop: ' + st + '<br>scrollBottom: ' + scrollBottom + '</h1>'); }); // SCROLLTESTER END //Para el futuro, convertí scrollBottom en un complemento jquery, utilizable de la misma manera que scrollTop (es decir, puede establecer un número y desplazará esa cantidad desde la parte inferior de la página y devolverá la cantidad de píxeles desde la parte inferior de la página, o devolver el número de píxeles desde la parte inferior de la página si no se proporciona ningún número)
$.fn.scrollBottom = function(scroll){ if(typeof scroll === 'number'){ window.scrollTo(0,$(document).height() - $(window).height() - scroll); return $(document).height() - $(window).height() - scroll; } else { return $(document).height() - $(window).height() - $(window).scrollTop(); } } //Basic Usage $(window).scrollBottom(500);