如何在极限情况下修复图像?

时间:2014-09-03 07:19:31

标签: jquery css wordpress woocommerce

我正在尝试修复 my site 产品页面中的图片。应根据选项修复图像。我添加了以下代码,但图像也漂浮在内容之上..

var images = jQuery('.single-product .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'


        });
    }
});
};

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

我也尝试在'auto'中使用0,100和不同的值,但不能正常工作 请帮我解决这个问题......谢谢!

更新 enter image description here

1 个答案:

答案 0 :(得分:0)

Javascript

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

    $window.scroll(function (e) {
        if ($window.scrollTop() > pos) {
            $this.css({
                position: 'absolute',
                top: pos
            });
        } else {
            $this.css({
                position: 'fixed',
                top: 0
            });
        }
    });
};

$('#yourDiv').followTo(250);

<强>的jsfiddle jsfiddle

  

更新1:

images.followTo(($("#myTab").offset().top)-(images.offset().top)- images.outerHeight());

JSFiddle

相关问题