Question

我正在开设woocommerce网站。 My Site 。单个产品页面有一个带有多个下拉选项的控制生成器。因此，当用户选择每个选项时，他无法看到顶部发生的变化。所以我将图像div定位为固定。如下所示。

.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测试时，脚本将在您的网站上运行。

我写了这个脚本，脚本归于：Stopping fixed position scrolling at a certain point?

请告诉我你是否可以从这里开始：）

div中div的固定位置

1 个答案: