10 examples of 'jquery move element on scroll' in JavaScript

97
function scrollElement(element: Element, x: number, y: number) {
98
  element.scrollLeft = x;
99
  element.scrollTop = y;
100
}

2280
function _scrollParentToElement (parent, element) {
2281
  parent.scrollTop = element.offsetTop - parent.offsetTop;
2282
}

1
function keepScroll (el, cb) {
2
  let prevTop = el.getBoundingClientRect().top
3
  cb()
4
  let newTop = el.getBoundingClientRect().top
5
  document.documentElement.style.scrollBehavior = ''
6
  window.scrollTo(window.scrollX, window.scrollY + newTop - prevTop)
7
  document.documentElement.style.scrollBehavior = 'smooth'
8
}

18
function scrollParent($el){
19
    var $scroller = $(window);
20
    $el.parents().each(function(i, el){
21
        var $el = $(el);
22
        if(['auto', 'scroll'].indexOf($el.css('overflow-y')) > -1){
23
            $scroller = $el;
24
            return false;
25
        }
26
    });
27
28
    return $scroller;
29
}

3
export default function scroll(element, {clientX, clientY, speed, sensitivity}) {
4
  if (scrollAnimationFrame) {
5
    cancelAnimationFrame(scrollAnimationFrame);
6
  }
7
8
  function scrollFn() {
9
    const rect = element.getBoundingClientRect();
10
    const offsetY = (Math.abs(rect.bottom - clientY) <= sensitivity) - (Math.abs(rect.top - clientY) <= sensitivity);
11
    const offsetX = (Math.abs(rect.right - clientX) <= sensitivity) - (Math.abs(rect.left - clientX) <= sensitivity);
12
    element.scrollTop += offsetY * speed;
13
    element.scrollLeft += offsetX * speed;
14
    scrollAnimationFrame = requestAnimationFrame(scrollFn);
15
  }
16
17
  scrollAnimationFrame = requestAnimationFrame(scrollFn);
18
}

36
public isScrolledIntoView($element: JQuery): boolean {
37
    this.ensureInit();
38
39
    let elementBottom: number;
40
    let viewBottom: number;
41
    let elementTop: number;
42
    let viewTop: number;
43
44
    const elHeight = $element.height() || 0;
45
46
    if (this.$scrollParent) {
47
        viewTop = 0;
48
        viewBottom = this.$scrollParent.height() || 0;
49
50
        const offset = $element.offset();
51
        const originalTop = offset ? offset.top : 0;
52
53
        elementTop = originalTop - this.scrollParentTop;
54
        elementBottom = elementTop + elHeight;
55
    } else {
56
        viewTop = jQuery(window).scrollTop() || 0;
57
58
        const windowHeight = jQuery(window).height() || 0;
59
        viewBottom = viewTop + windowHeight;
60
61
        const offset = $element.offset();
62
63
        elementTop = offset ? offset.top : 0;
64
        elementBottom = elementTop + elHeight;
65
    }
66
67
    return elementBottom <= viewBottom && elementTop >= viewTop;
68
}

27
function saveScroll(element) {
28
	var scrollPos = v.scrollPos; // v.scrollContainer.scrollTop()
29
	if (!element) {
30
		var bottomPos = scrollPos + v.scrollContainer.height() - v.bottomThreshold;
31
		//console.log('FINDING: ' + bottomPos);
32
		element = v.messages.children().filter(function (index) { return ($(this).position().top + $(this).height()) >= bottomPos; }).first();
33
	}
34
	if (!element || !element.length) {
35
		//console.log('USING LAST!');
36
		element = v.messages.children().last ();
37
	}
38
	if (element && element.length) {
39
		var pos = element.position().top + element.height() - scrollPos;
40
		//console.log(element.html());
41
		//console.log('element pos:' + element.position().top + ', pos:' + pos + ', scroll pos:' + scrollPos + ', doc size:' + v.scrollContent.height());
42
		var scroll = {
43
			pos: pos,
44
			element: element
45
		};
46
		v.scrolls.push(scroll);
47
		return scroll;
48
	}
49
	return null;
50
}

298
function preventParentScroll(el, event){
299
    var state = getState(el);
300
301
    if (state.visibleArea >= 1) {
302
        return false;
303
    }
304
305
    var scrollDist = state.el2.scrollHeight - state.el2.clientHeight;
306
    var scrollTop = state.el2.scrollTop;
307
308
    var wheelingUp = event.deltaY < 0;
309
    var wheelingDown = event.deltaY > 0;
310
311
    if ( (scrollTop <= 0) && wheelingUp) {
312
        event.preventDefault();
313
        return false;
314
    }
315
316
    if ( (scrollTop >= scrollDist) && wheelingDown) {
317
        event.preventDefault();
318
        return false;
319
    }
320
321
}

88
function scrollHightlight(element) {
89
  var $headers = $(element);
90
91
  $(window).scroll(function() {
92
    var currentScroll = $(this).scrollTop();
93
    var $currentSection;
94
95
    $headers.each(function() {
96
      var divPosition = $(this).offset().top - 100;
97
      if (divPosition - 1 < currentScroll) {
98
        $currentSection = $(this);
99
      }
100
      if ($currentSection && $currentSection.attr('id')) {
101
        var id = $currentSection.attr('id');
102
      }
103
104
      $('.sidebar-header-2 a').removeClass('active');
105
      id = "'#" + id + "'";
106
      $('.sidebar-header-2 [href=' + id + ']').addClass('active');
107
    });
108
  });
109
}

144
function smooth_scroll_to(elem) {
145
  $('html, body').animate({
146
      scrollTop: Math.max(elem.offset().top-50, 0)
147
  });
148
}