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

Every line of 'jquery move element on scroll' code snippets is scanned for vulnerabilities by our powerful machine learning engine that combs millions of open source libraries, ensuring your JavaScript code is secure.

All examples are scanned by Snyk Code

By copying the Snyk Code Snippets you agree to
this disclaimer
97function scrollElement(element: Element, x: number, y: number) {
98 element.scrollLeft = x;
99 element.scrollTop = y;
100}
Important

Use secure code every time

Secure your code as it's written. Use Snyk Code to scan source code in minutes – no build needed – and fix issues immediately. Enable Snyk Code

2280function _scrollParentToElement (parent, element) {
2281 parent.scrollTop = element.offsetTop - parent.offsetTop;
2282}
1function 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}
18function 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}
3export 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}
36public 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}
27function 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}
298function 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}
88function 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}
144function smooth_scroll_to(elem) {
145 $('html, body').animate({
146 scrollTop: Math.max(elem.offset().top-50, 0)
147 });
148}

Related snippets