向下滚动时，jQuery滚动到固定位置

Question

我对滚动到固定的jquery插件有一个问题。

我从codepen.io创建了这个DEMO

当您向下滚动然后固定化身图像时，可以在此演示中看到，但是如果向上滚动，则问题就在该位置.text位置。 我该如何解决任何人都可以帮助我的问题？

Answer 1

在所附的jQuery中，有一个方法“ setFixed（）”将位置设置为position ='fixed'; 将其更改为position ='relative'

实际功能

function setFixed() {
        // Only fix the target element and the spacer if we need to.
        if (!isFixed()) {
            // Set the spacer to fill the height and width of the target
            // element, then display it.
            spacer.css({
                'display' : target.css('display'),
                'width' : target.outerWidth(true),
                'height' : target.outerHeight(true),
                'float' : target.css('float')
            });

            // Set the target element to fixed and set its width so it does
            // not fill the rest of the page horizontally. Also, set its top
            // to the margin top specified in the options.

            cssOptions={
                'z-index' : base.options.zIndex,
                'position' : 'relative',
                'top' : base.options.bottom == -1?getMarginTop():'',
                'bottom' : base.options.bottom == -1?'':base.options.bottom,
                'margin-left' : '0px'
            }
            if (!base.options.dontSetWidth){ cssOptions['width']=target.css('width'); };

            target.css(cssOptions);

            target.addClass(base.options.baseClassName);

            if (base.options.className) {
                target.addClass(base.options.className);
            }

            position = 'fixed';
        }
    }

改成

function setFixed() {
        // Only fix the target element and the spacer if we need to.
        if (!isFixed()) {
            // Set the spacer to fill the height and width of the target
            // element, then display it.
            spacer.css({
                'display' : target.css('display'),
                'width' : target.outerWidth(true),
                'height' : target.outerHeight(true),
                'float' : target.css('float')
            });

            // Set the target element to fixed and set its width so it does
            // not fill the rest of the page horizontally. Also, set its top
            // to the margin top specified in the options.

            cssOptions={
                'z-index' : base.options.zIndex,
                'position' : 'relative',
                'top' : base.options.bottom == -1?getMarginTop():'',
                'bottom' : base.options.bottom == -1?'':base.options.bottom,
                'margin-left' : '0px'
            }
            if (!base.options.dontSetWidth){ cssOptions['width']=target.css('width'); };

            target.css(cssOptions);

            target.addClass(base.options.baseClassName);

            if (base.options.className) {
                target.addClass(base.options.className);
            }

            position = 'relative';
        }
    }