How to tell if something is scrolled into view?

Question

I'm trying to re-create something similar to the effect here. When you scroll down to the bottom of the page, an "Also Check Out" div slides from the right. I am assuming this works by using the jQuery function scroll and then checks if a certain div is in view or not. I, however, cannot even get the scroll function to work. I tried both using $("#div_name").scroll(function(){}); and $("#div_name").on("scroll", function(){});, but neither seem to be working. It appears that neither one of my ways of going about it are hooking the scroll functions properly. Here is my fiddle

Anyone have any ideas what I'm doing wrong in my fiddle?

score 1 · Answer 1 · answered Sep 04 '13 at 17:59

1

As has been posted multiple times here:

http://imakewebthings.com/jquery-waypoints/

does exactly what you are looking for.

answered Sep 04 '13 at 17:59

Jonathan Crowe

5,590
1
15
27

I'm getting `Uncaught TypeError: Object [object Object] has no method 'waypoint'` in my console... link: http://jsfiddle.net/GmbBu/1/ – jas7457 Sep 04 '13 at 18:03
Oh I see it's an external jquery library, not a native one? – jas7457 Sep 04 '13 at 18:05

score 0 · Answer 2 · answered Sep 04 '13 at 18:18

Are you trying to get something like this
Edited DEMO

Script:

$(function(){
        var a;var c=false;
        var b=$("#popContent");
        var e=$(window);
        var d=$('#footer').position().top;
        e.scroll(function(){
            window.clearTimeout(a);
            a=window.setTimeout(function(){
            if(e.scrollTop()<=d){
              if(c==false)   { 
                  c=true;b.stop(true,true).show(); 
                  }else{
                         c=false;b.fadeOut(500)

            }}},100)})
});

How to tell if something is scrolled into view?

2 Answers2