如何使div的滚动条居中?
这就是我所拥有的:
<div id="mydiv" style="width:1000px;overflow:auto;">
<img src="..." style="width:100%;height:250px;" />
</div>
$(window).on('resize', function () {
$('#mydiv').scrollLeft(
$( "#mydiv" ).width() - $( "#mydiv" ).width()/2
);
});
但这是行不通的。它不完全居中。太糟糕了,我无法将百分比设为50%。scrollLeft(()函数需要一个整数。
谢谢!
这是您的解决方案,我已经检查了所有小于图像宽度的可能宽度。甚至用塑料尺..LOL测量滚动条的左右两侧空间。:)检查双方是否相等
var outer=document.getElementById('mydiv').offsetWidth
var inner=document.getElementById('im').offsetWidth;
console.log(inner);
$('#mydiv').scrollLeft((inner-outer)/2)
<div id="mydiv" style="overflow:auto; overflow-y:hidden;width:300px">
<img id="im" src="http://eofdreams.com/data_images/dreams/image/image-15.jpg" />
</div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句