如何在JavaScript中获得HTML元素的水平滚动百分比？

如何计算元素上滚动条在开始和结束之间覆盖的“距离”百分比

<div id="container" style="overflow-x:scroll; max-width:1000px;">
  <div id="contained" style="width:3000px;"></div>
</div>

<script>
  $('#container').scroll(function(){
    var scrollPercentage; //How to get scroll percentage?
  });
</script>

$（'#容器'）。滚动（函数（）{
var scrollPercentage；//如何获取滚动百分比？
});

因此，如果滚动条完全位于左侧，我们希望得到

0

，如果滚动条完全位于右侧，我们希望得到

100

，请参见此处：

例如，将该数字四舍五入到两位小数可能很有用。然后，使用

scrollPercentage.toFixed(2);

---

编辑：更好地使用

var scrollPercentage = 100 * this.scrollLeft / (this.scrollWidth-this.clientWidth); 

正如@Blazemonger所指出的那样

var scrollPercentage = 100 * this.scrollLeft / (this.scrollWidth-this.clientWidth); 

或者，如果您确实必须使用jQuery：

scrollPercentage = 100 * $(this).scrollLeft() / ($('#contained').width() - $(this).width());

scrollPercentage = 100 * $(this).scrollLeft() / ($('#contained').width() - $(this).width());