div内div的固定位置

Question

我在woocommerce网站上工作。 我的网站 。 单个产品页面具有一个控件生成器，该控件生成器具有许多下拉选项。因此，当用户选择每个选项时，他看不到顶部发生的更改。

.single-product .images{position:fixed;}

这使图像固定，但它一直浮动到页面。我只需要在描述/评论选项卡开始之前就需要它。是否有任何其他的CSS或任何js / jquery解决方案来解决这个问题。请帮助。谢谢！

Answer 1

根据您的网站环境，您需要以下内容：

var images = jQuery('.images');

jQuery.fn.followTo = function (pos) {
    var $this = this,
        $window = jQuery(window);

    $window.scroll(function (e) {
        if ($window.scrollTop() > pos) {
            $this.css({
                position: 'absolute',
                top: pos - $this.height()
            });
        } else {
            $this.css({
                position: 'fixed',
                top: 'auto' //earlier it was 0
            });
        }
    });
};

images.followTo(jQuery('#myTab').offset().top - images.height());

您可能需要稍微重新定位元素，但是该脚本将在您的网站上正常运行，正如我使用firebug测试的那样。

我已记下此脚本，该脚本归因于： 在某个点停止固定位置滚动？

让我知道您是否可以从这里继续前进：）