为什么滚动条没有'；当它通过javascript公式与其他滚动条链接时，是否无法到达终点？

我实际上在处理一个带有多个滚动条的代码，它们都是链接的，所以如果你移动其中一个，其他两个会成比例地移动，我说成比例，因为它们的宽度不同。这很有趣，但效果不太好，因为有时（现在总是）滚动条没有到达滚动条的末端

所以我的问题是：如何修改我的代码，用滚动条到达滚动条的末尾？ PS：您必须将鼠标悬停在绿色div上才能显示第三个滚动条。 线索：我认为问题的根源与链接滚动条的函数直接相关，但我不知道它们有什么问题

代码如下：

让w_mob_len=getComputedStyle（document.getElementById（'w_mob_child'），null）.width.replace（“px”，null）-getComputedStyle（document.getElementById（'w_mob'）），width.replace（“px”，null）；
让w_top_len=getComputedStyle（document.getElementById（'w_top_child'），null）.width.replace（“px”，”）-getComputedStyle（document.getElementById（'w_top'），null）.width.replace（“px”，”）；
让w_tab_len=getComputedStyle（document.getElementById（'w_tab_child'），null）.width.replace（“px”，“null”）-getComputedStyle（document.getElementById（'w_tab'），null）.width.replace（“px”，“null”）；
函数move\u scrollbar\u mobile（）{
让wrap_mob=document.getElementById（“w_mob”）；
让wrap_top=document.getElementById（“w_top”）；
让wrap_tab=document.getElementById（“w_tab”）；
wrap_top.scrollLeft=wrap_mob.scrollLeft*w_top_len/w_mob_len；
wrap_tab.scrollLeft=wrap_mob.scrollLeft*w_tab_len/w_mob_len；
}
函数move\u scrollbar\u top（）{
让wrap_mob=document.getElementById（“w_mob”）；
让wrap_top=document.getElementById（“w_top”）；
让wrap_tab=document.getElementById（“w_tab”）；
wrap_mob.scrollLeft=wrap_top.scrollLeft*w_mob_len/w_top_len；
wrap_tab.scrollLeft=wrap_top.scrollLeft*w_tab_len/w_top_len；
}
函数move\u scrollbar\u table（）{
让wrap_mob=document.getElementById（“w_mob”）；
让wrap_top=document.getElementById（“w_top”）；
让wrap_tab=document.getElementById（“w_tab”）；
wrap_mob.scrollLeft=wrap_tab.scrollLeft*w_mob_len/w_tab_len；
wrap_top.scrollLeft=wrap_tab.scrollLeft*w_top_len/w_tab_len；
}
函数disp_scroll_mob（）{
document.getElementById（“w_mob”）.style.display=“内联块”；
}
函数隐藏\滚动\移动（）{
设w_flo=document.getElementById（“w_flo”）；
w_flo.addEventListener（“mouseleave”，function（））{
document.getElementById（“w_mob”）.style.display=“无”；
});
}
函数disp\u scroll\u mob\u alt（）{
让w_mob=document.getElementById（“w_mob”）；
w_mob.addEventListener（“鼠标指针”，函数（）{
document.getElementById（“w_mob”）.style.display=“内联块”；
})
}

.wrapper\u top，
.u表{
宽度：300px；
溢出-x：滚动；
溢出y：隐藏；
}
.U.移动电话{
位置：固定；
宽度：100px；
高度：50px；
排名前10%；
溢出-x：滚动；
溢出y：隐藏；
显示：无；
填充：10px；
背景色：红色；
z指数：2；
垫底：10px；
}
.u浮球{
宽度：100%；
身高：60%；
最高：20%；
位置：相对位置；
背景色：#88FF88；
z指数：1；
}
.你的上衣{
高度：20px；
}
.u表{
高度：200px；
}
.child_top{
宽度：1000px；
高度：20px；
}
.child_mobile{
宽度：300px；
高度：20px；
}
.search_表{
表布局：固定；
}
th{
字体大小：15px；
背景#66C2E0；
}
th{
最小宽度：200px；
}

可乐
可乐
可乐
可乐
可乐
可乐6
可乐

我认为主要的问题是，您在所有三个div中触发滚动事件，并且取决于最后调用哪个，这将影响所有div的结束位置

我已经尝试在下面添加了一个小延迟，这不是生产代码，但应该可以让您了解如何减少Jankines

const wrap_mob=document.getElementById（“w_mob”）；
const wrap_top=document.getElementById（“w_top”）；
const wrap_tab=document.getElementById（“w_tab”）；
让lastScrollMob、lastScrollTop、lastScrollTable=0；
让滚动=假；
wrap_mob.addEventListener（'scroll'，函数（e）{
lastScrollMob=wrap_mob.scrollLeft；
如果（！滚动）{
window.requestAnimationFrame（函数（）{
scrollMobile（lastScrollMob）；
滚动=假；
});
滚动=真；
}
});
wrap_top.addEventListener（'scroll'，函数（e）{
lastScrollTop=wrap_top.scrollLeft；
如果（！滚动）{
window.requestAnimationFrame（函数（）{
scrollTop（最后一个scrollTop）；
滚动=假；
});
滚动=真；
}
});
换行选项卡。addEventListener（'scroll'，函数（e）{
lastScrollTable=wrap_tab.scrollLeft；
如果（！滚动）{
window.requestAnimationFrame（函数（）{
滚动表（lastScrollTable）；
滚动=假；
});
滚动=真；
}
});
功能滚动（金额）{
百分比=（金额/移动量）*100；
环绕顶部。滚动左=（带顶部长度/100）*百分比；
换行选项卡。滚动左=（带选项卡长度/100）*百分比；
}
功能滚动顶部（金额）{
百分比=（金额/顶部长度）*100；
包裹移动。滚动左=（移动长度/100）*百分比；
换行选项卡。滚动左=（带选项卡长度/100）*百分比；
}
功能滚动表（金额）{
百分比=（金额/带标签页）*100；
包裹移动。滚动左=（移动长度/100）*百分比；
环绕顶部。滚动左=（带顶部长度/100）*百分比；
}
让w_mob_len=getComputedStyle（document.getElementById（'w_mob_child'），null）.width.replace（“px”，null）-getComputedStyle（wrap_mob，null）.width.replace（“px”，null）；
让w_top_len=getComputedStyle（document.getElementById（'w_top_child'），null）.width.replace（“px”，null）-getComputedStyle（wrap_top，null）.width.replace（“px”，null）；
让w_tab_len=getComputedStyle（document.ge