Javascript scrolling does not stop

微信扫一扫,分享到朋友圈

Javascript scrolling does not stop

hi everyone i’m trying to do simple scroll share box widget but it doesn’t work. It must stop on special div (stopscroll), but it don’t stop and scrolling down until web page footer. any ideas why?

var windw = this;

$.fn.followTo = function ( elem ) {
    var $this = this,
        $window = $(windw),
        $bumper = $(elem),
        bumperPos = $bumper.offset().top,
        thisHeight = $this.outerHeight(),
        setPosition = function(){
            if ($window.scrollTop() <= (bumperPos - thisHeight)) {
                $this.css({
                    position: 'absolute',
                    top: (bumperPos - thisHeight)
                });
            } else {
                $this.css({
                    position: 'fixed',
                    top: 0
                });
            }
        };
    $window.resize(function()
    {
        bumperPos = pos.offset().top;
        thisHeight = $this.outerHeight();
        setPosition();
    });
    $window.scroll(setPosition);
    setPosition();
};

$('#share_box').followTo('#stopscroll');

but it doesn’t stop on the div #stopscroll.

css file looks like that:

#share_box{
background: none repeat scroll 0% 0% #E1E1E1;
position: fixed;
width: 65px;
padding: 15px;
border-radius: 5px 0px 0px 5px;
left: 1.89%;}

any ideas? here is jsfiddle http://jsfiddle.net/NCY6x/

There are lots of syntax and variable mistakes in your code…

I have updated the fiddle with a working and simpler demo: http://jsfiddle.net/NCY6x/2/

$.fn.followTo = function ( elem ) {
    var stopper = $(elem);
    var box = this;
    $(window).on("scroll resize", function(){
        var x_distance = (stopper.offset().top- box.outerHeight());
        if($(window).scrollTop() >= x_distance){
            box.css({"position": "absolute", "top": x_distance});
        } else {
            box.css({"position": "fixed", "top": 0});
        }
    });
};

$('#share_box').followTo('#stopscroll');

微信扫一扫,分享到朋友圈

Javascript scrolling does not stop

The web built using node and vue, imitate Twitter's UI and features.

上一篇

传华硕计划分拆智能手机业务,本月将裁员上百人 | 9月30日坏消息榜

下一篇

你也可能喜欢

Javascript scrolling does not stop

长按储存图像,分享给朋友