Javascript 在特定div之前停止浮动div（通用）

我尝试使一个div浮动，然后在一个特定的div（在本例中为页脚）之前停止，它在我的屏幕上工作，但是在一个更大的屏幕上尝试时，浮动div会稍微高一点

我想避免每个特定屏幕的媒体屏幕

$window.scroll（函数（）{
ws_cart=$（this.scrollTop（）；
var cart_position=$（'.product_desc'）.position（）；
var footer_position=$（'.footer_position'）.position（）；
//警报（“宽度”+scWidth+“高度”+SCHIGHT）；
//警报（ws_cart+“”+页脚位置。顶部）；
//警报（页脚位置，top-350）；
//警报（ws_cart）；
如果（scWidth>=1024&&scWidth（cart_position.top+65））{
$（'.product_fixed'）.css({
“位置”：“固定”，
“右”：“1.6em”，
“顶部”：“0px”，
“z索引”：“999”，
“背景”：“fff”
});
}否则{
$（'.product_fixed'）.css({
“位置”：“相对”，
“顶部”：“，
“右”：“0”，
“宽度”：“320px”
});
}
如果（ws_cart>（cart_position.top+65）
&&ws_cart>（footer_position.top-624））{
$（'.product_fixed'）.css({
“位置”：“相对”，
“右”：“0”，
“顶部”：“146em”，
“高度”：“600px”，
“z索引”：“999”，
“背景”：“fff”
});
}
}否则如果（scWidth>=1125&&scWidth（cart_position.top+65））{
$（'.product_fixed'）.css({
“位置”：“固定”，
“右”：“1.6em”，
“顶部”：“0px”，
“z索引”：“999”，
“背景”：“fff”
});
}否则{
$（'.product_fixed'）.css({
“位置”：“相对”，
“顶部”：“，
“右”：“0”，
“宽度”：“320px”
});
}
如果（ws_cart>（cart_position.top+65）
&&ws_cart>（footer_position.top-460））{
$（'.product_fixed'）.css({
“位置”：“相对”，
“右”：“0”，
“顶部”：“90em”，
“高度”：“600px”，
“z索引”：“999”，
“背景”：“fff”
});
}
}否则如果（scWidth>=1200&&scWidth（cart_position.top+65））{
$（'.product_fixed'）.css({
“位置”：“固定”，
“右”：“1.6em”，
“顶部”：“0px”，
“z索引”：“999”，
“背景”：“fff”
});
}否则{
$（'.product_fixed'）.css({
“位置”：“相对”，
“顶部”：“，
“右”：“0”，
“宽度”：“320px”
});
}
如果（ws_cart>（cart_position.top+65）
&&ws_cart>（footer_position.top-512））{
$（'.product_fixed'）.css({
“位置”：“相对”，
“右”：“0”，
“顶部”：“102em”，
“高度”：“520px”，
“z索引”：“999”，
“背景”：“fff”
});
}
}
});
您应该真正考虑使用样式表，而只是添加/删除类。这么多的内联样式通常是个坏消息。请停止！第一：你永远不想在你的JS中有任何具体的CSS属性！第二：您正在用JS进行媒体查询。在CSS中执行它们。第三，查找CSS的相对和流体定位以及flexbox和媒体查询。