Consider the code snippet below:
24 <script type="text/javascript">
25
26 function UpdateDisplay($isVisible){
27 if($isVisible)
28 $('.relatedContent').stop().css({
29 "transform": "translate3d(-20px,0,0)"
30 });
31 else
32 $('.relatedContent').stop().css({
33 "transform": "translate3d(105%,0,0)"
34 });
35 }
36
37 $(document).ready(function(){
38 var offset = $(window).height() / 9;
39
40 if($('body').height() > ($(window).height() + offset))
41 $(window).scroll(function( e ) {
42
43 if($(window).scrollTop() > offset)
44 UpdateDisplay(true);
45 else
46 UpdateDisplay(false);
47 });
48 else
49 UpdateDisplay(true);
50 });
51
52 </script>
This script triggers a pop-up element on a website upon scrolling.
You mentioned wanting to delay the appearance of the item until later in the scroll, such as when reaching a specific distance like 100 pixels from the bottom of the page.
Changing the value at line 38 doesn't yield any visible changes. How can this effect be achieved?