jquery - Creating a javascript popup box when user scrolls - Stack Overflow

admin管理员组

文章数量:1432632

A bit of a different question!

Does anyone know where there is either a plugin or point me in the right direction to create something like this: /

When you get to the end of an article a box appears in the bottom right hand side of the screen!

Any ideas?

Thanks Ricky

A bit of a different question!

Does anyone know where there is either a plugin or point me in the right direction to create something like this: http://mashable./2012/05/30/kings-social-media/

When you get to the end of an article a box appears in the bottom right hand side of the screen!

Any ideas?

Thanks Ricky

• javascript
• jquery
• html

Share Improve this question Follow asked May 30, 2012 at 21:40 RuFFCuTRuFFCuT 3171111 silver badges3434 bronze badges 2

• 1 It's relatively simple, Get the top position of the article container and it's height, then on scroll(of window), check to see if the scroll position is greater than the screen height minus the top of the article minus the article height. If that is true, show the dialog, else, hide it. Very similar to all of the semi-fixed position menus. – Kevin B Commented May 30, 2012 at 21:47
• What have you tried? Also, on a personal note, I hate those things. – josh3736 Commented May 30, 2012 at 21:54

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 4

A simple example from a blog I found:

function getScrollY() 
{
    var y = 0;
    y = document.body.scrollBottom;
    return y
}

Then use this as a .js include (similar to this JSFiddle I found):

(function($) 
{
    $area.scroll(function(e) 
    {
        if($(this).scrollBottom() < $('#divToShowBoxOn').offset().left)
            alert("Zomg you scrolled to my box!");
    }
})(jQuery)​

where area is the place you want to measure from

jQuery inView plugin is super awesome. Just put a div at the bottom of your page and when it es into view this handler will call your function.

http://remysharp./2009/01/26/element-in-view-event-plugin/

本文标签： jqueryCreating a javascript popup box when user scrollsStack Overflow