gpt4 book ai didi

Why is css transform-origin cutting space from top and left?(为什么css转换原点从上到左切割空间?)

转载 作者:bug小助手 更新时间:2023-10-22 16:38:57 26 4
gpt4 key购买 nike



I have an svg container inside a div container,

我在div容器中有一个svg容器,


.map-container {
width: 100%;
position: relative;
transform-origin: 50% 50%;
img {
max-width: 100%;
}
.svg-container {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 100;
}
}

Inside my Vue component template I'm zooming in using css transform: scale().

在我的Vue组件模板中,我正在使用css transform:scale()进行放大。


<div class="map-container" :style="{ transform: `scale(${store.zoomLevel})` }">

The problem is that if transform-origin in not set to top left (it's not there or has 50% 50% or center values), then when zooming, the left and top part are cut off and you cant' scroll to them like you can down or right. Can I fix it still having transform-origin centering the image on zoom?

问题是,如果变换原点没有设置为左上角(它不在那里,或者有50%、50%或中心值),那么在缩放时,左侧和顶部会被切掉,你不能像向下或向右滚动一样滚动到它们。我可以修复它仍然具有以缩放图像为中心的变换原点吗?


更多回答
优秀答案推荐
更多回答

26 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com