jquery: $ (ventana) .scrollTop () pero no $ (ventana) .scrollBottom ()

Quiero colocar un elemento al final de la página cada vez que el usuario se desplaza por la página. Es como una "posición fija" pero no puedo usar "position: fixed" css ya que muchos de los navegadores de mis clientes no pueden soportar eso.

Noté que jquery puede obtener la posición superior actual de la ventana gráfica, pero ¿cómo puedo obtener la parte inferior de la ventana gráfica de desplazamiento?

Entonces estoy preguntando cómo saber: $ (ventana) .scrollBottom ()

var scrollBottom = $(window).scrollTop() + $(window).height();

Yo diría que un scrollBottom como un 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, he convertido 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á el número de píxeles desde la parte inferior de la página, o devolver el número de píxeles de 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);

var scrollBottom =
    $(document).height() - $(window).height() - $(window).scrollTop();

Creo que es mejor obtener el desplazamiento inferior.

Esto se desplazará hasta la parte superior:

$(window).animate({scrollTop: 0});

Esto se desplazará hasta el final:

$(window).animate({scrollTop: $(document).height() + $(window).height()});

.. cambie la ventana a su ID de contenedor o clase deseada si es necesario (entre comillas).

Aquí está la mejor opción para desplazarse hacia abajo para la cuadrícula de la tabla, se desplazará hasta la última fila de la cuadrícula de la tabla:

 $('.add-row-btn').click(function () {
     var tempheight = $('#PtsGrid > table').height();
     $('#PtsGrid').animate({
         scrollTop: tempheight
         //scrollTop: $(".scroll-bottom").offset().top
     }, 'slow');
 });

// Back to bottom button
$(window).scroll(function () {
    var scrollBottom = $(this).scrollTop() + $(this).height();
    var scrollTop = $(this).scrollTop();
    var pageHeight = $('html, body').height();//Fixed

    if ($(this).scrollTop() > pageHeight - 700) {
        $('.back-to-bottom').fadeOut('slow');
    } else {
        if ($(this).scrollTop() < 100) {
            $('.back-to-bottom').fadeOut('slow');
        }
        else {
            $('.back-to-bottom').fadeIn('slow');
        }
    }
});
$('.back-to-bottom').click(function () {
    var pageHeight = $('html, body').height();//Fixed
    $('html, body').animate({ scrollTop: pageHeight }, 1500, 'easeInOutExpo');
    return false;
});

tratar:

 $(window).scrollTop( $('body').height() );

var scrolltobottom = document.documentElement.scrollHeight - $(this).outerHeight() - $(this).scrollTop();

Este es un truco rápido: simplemente asigne el valor de desplazamiento a un número muy grande. Esto asegurará que la página se desplace hasta la parte inferior. Usando javascript simple:

document.body.scrollTop = 100000;