1
divがあり、そのdivの中に 'svg'要素があります。 私はズームインしたいと思うし、クリックするたびに 'svg'要素の 'scale'値が増えてズーム効果が生まれます。 しかし、何らかの理由で親divのスクロールバーが内部 'svg'の縮尺が大きくなるときに変更されていません。 この問題はChromeでのみ発生し、IEでは実際に必要な結果が得られます。私が見ることができるものから、クロムのスケールが変更されたときにスクロールバーが変更されない
var elementToScale = document.getElementById('svg');
var scale = 1;
document.getElementById('zoom').addEventListener('click', function() {
scale += 0.1
elementToScale.style.transform = "scale(" + scale + ")";
});
div {
border: 1px solid black;
width: 400px;
height: 400px;
overflow: scroll;
}
svg {
border: 1px solid black;
}
<div>
<svg width=300px height=300px id="svg">
<rect width=200 height=200 x=50 y=50 fill="red" />
</svg>
</div>
<br>
<button id="zoom">
ZoomIn
</button>