Как я могу сделать дружественный канал как систему управления прокруткой окна? - PullRequest
Новая
       30

Как я могу сделать дружественный канал как систему управления прокруткой окна?

2 голосов
/ 25 декабря 2009

При активном обновлении в реальном времени новые записи динамически добавляют div. На этом этапе прокрутка автоматически перемещается. Это действие предоставляет контент, который вы не пропустите в видимой области.

Если вы хотите увидеть это действие, вы также можете посмотреть этот скринкаст; http://www.viddler.com/explore/itod/videos/45/

Мой метод; 

    // Firstly, i am storing the first entry's(in view) positions in window object;
jQuery(window).scroll(function() { 
  var q = 0;
  jQuery(".entry").each(function (i) {
    if (jQuery(this).offset().top > jQuery(window).scrollTop()) {
      if (q == 0) {
      window.show_id = jQuery(this).attr("id");
      window.pos_y = jQuery(this).offset().top - jQuery(window).scrollTop();
      q = 1;
      }
    }
  });
    });

// After coming to the new entry, i call this function;
function scroll_control() {
  var scroll_top = jQuery(window).scrollTop();
  if (scroll_top != 0) {
    if (jQuery('#'+window.show_id).length != 0) {
      var scr = jQuery('#'+window.show_id).offset().top - window.pos_y;
      window.scrollTo(0, scr);
    }
  }
}

// but this is due to flashing. I guess not fast enough

1 Ответ

0 голосов
/ 22 декабря 2011

Я предполагаю, что вы хотите плавно прокрутить вверх, вместо того, чтобы прыгать, чтобы решить проблему «мигания». Я бы сделал что-то вроде этого: 

function scroll_control() {
  var scroll_top = jQuery(window).scrollTop();
  if (scroll_top != 0) {
    if (jQuery('#'+window.show_id).length != 0) {
       var scr = jQuery('#'+window.show_id).offset().top - window.pos_y;
       // Instead of jumping to src use jQuery animate
       // window.scrollTo(0, scr);
       var scrollElem = scrollableElement('html', 'body');
       $(scrollElem).animate({scrollTop: scr}, 400);
    }
  }
}

/* 
 * Use the first element that is "scrollable"  (cross-browser fix?)
 * http://css-tricks.com/snippets/jquery/smooth-scrolling/
 */
function scrollableElement(els) {
for (var i = 0, argLength = arguments.length; i <argLength; i++) {
    var el = arguments[i],
    $scrollElement = $(el);
    if ($scrollElement.scrollTop()> 0) {
        return el;
    } else {
        $scrollElement.scrollTop(1);
        var isScrollable = $scrollElement.scrollTop()> 0;
        $scrollElement.scrollTop(0);
        if (isScrollable) {
            return el;
        }
    }
}
return [];
}
...