BRNSystems/js
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity

init

Browse Source
This commit is contained in:
Bruno Rybársky 2022-05-16 19:35:48 +02:00
parent 353c04478f
commit 633cf5f980
5 changed files with 58 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

19
bouncyscroll.js Normal file
View File

@ -0,0 +1,19 @@
//on ready
$(document).ready(function(){
//create bounce scroll div
$('body').append('<div id="bounce_scroll_div"></div>');
//set css
$('#bounce_scroll_div').css({
'position':'absolute',
'width':'1px',
'height':'1px',
'overflow':'scroll',
'z-index':'100',
//position it via top a bit lower than bottom of the page
});
//on page scroll move infiscroll div a bit lower than viewport
setInterval(function(){
//set the top to a sinusoidal function that bounces up and down the page amplitude is twice the viewport height and offset is the current scroll position
$('#bounce_scroll_div').css('top',(Math.sin(new Date().getTime()/250)*$(window).height()*4)+$(document).scrollTop()+$(window).height()+'px');
},1);
});

1
bouncyscroll.min.js vendored Normal file
View File

@ -0,0 +1 @@
$(document).ready(function(){$("body").append('<div id="bounce_scroll_div"></div>'),$("#bounce_scroll_div").css({position:"absolute",width:"1px",height:"1px",overflow:"scroll","z-index":"100"}),setInterval(function(){$("#bounce_scroll_div").css("top",Math.sin((new Date).getTime()/250)*$(window).height()*4+$(document).scrollTop()+$(window).height()+"px")},1)});

11
index.html Normal file
View File

@ -0,0 +1,11 @@
<!DOCTYPE html>
<html lang="en">
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!--<script src="infiscroll.js"></script>-->
<script src="bouncyscroll.js"></script>
</head>
<body>
</body>
</html>

26
infiscroll.js Normal file
View File

@ -0,0 +1,26 @@
function belowviewport(){
var top = $(window).scrollTop();
top += $(window).height();
top += 5;
//add 10% of the viewport height to the top
top += $(window).height() * 0.1;
return top;
}
//create div for infiscroll in jquery
$(document).ready(function(){
$('body').append('<div id="infiscroll_div"></div>');
$('#infiscroll_div').css({
'position':'absolute',
'width':'1px',
'height':'1px',
'overflow':'scroll',
'z-index':'100',
'top':belowviewport()+'px',
//position it via top a bit lower than bottom of the page
});
//on page scroll move infiscroll div a bit lower than viewport
$(window).scroll(function(){
$('#infiscroll_div').css('top',belowviewport()+'px');
});
});

1
infiscroll.min.js vendored Normal file
View File

@ -0,0 +1 @@
function belowviewport(){var i=$(window).scrollTop();return i+=$(window).height(),i+=5,i+=.1*$(window).height()}$(document).ready(function(){$("body").append('<div id="infiscroll_div"></div>'),$("#infiscroll_div").css({position:"absolute",width:"1px",height:"1px",overflow:"scroll","z-index":"100",top:belowviewport()+"px"}),$(window).scroll(function(){$("#infiscroll_div").css("top",belowviewport()+"px")})});