Question

我为网站的列设置了固定容器，滚动工作正常。问题是，我需要通过停止运动来限制固定的属性，以达到div下方的联系表格。

THX！

Hola muy buenas，

he establecido un contenedor con propiedad fija para una de las columnas de mi sitio web y el scroll vertical funciona correctamente。 El problema es，que necesito limitar la propiedad fija para detener el movimiento al chocar con el contenedor del formulario de contacto de la parte inferior。

格拉西亚斯！

错误演示：http://enredoweb.com

代码jQuery：

$(window).scroll(function() {
$("#catalogModule").css("top",Math.max(0,554-$(this).scrollTop()));
});

代码CSS：

#catalogModule {
    float:left;
    width:186px;
    background-color:red;
    position:fixed; 
    top:554px;
}

Answer 1

$.fn.scrollBottom = function() { 
  return $(document).height() - this.scrollTop() - this.height(); 
};

$(window).unbind('scroll');
$(window).scroll(function() {
    nav = $("#catalogModule");
    if((nav.position().top+nav.height()) >= $('#contact1').position().top) {  
        realFooterHeight = $('#contact1').height()+$('#footer1').height();

        nav.css("top","auto");
        nav.css("bottom",realFooterHeight-$(this).scrollBottom());
    }
    else {
        nav.css("bottom",'auto');
       nav.css("top",Math.max(0,554-$(this).scrollTop()));
    }
});

限制固定容器的垂直移动

1 个答案: