CSS 缩放，然后调整为原始大小
我正在使用带有溢出：滚动的 div 创建“缩放”效果。这是我的困境：
我使用以下方法：
$('#object').css({ 'transform':'scale(50)' });
效果很好，但现在我想以数学方式将元素的大小调整为其原始宽度/高度（将比例保持在 50%，或任何可能的值...）
$('#object').css({ 'width': ?+'px', 'height': ?+'px' });
很确定这一点是一个数学问题，我可以解决以下问题：
new_width = parseInt(origWidth) + parseInt(Math.round(origWidth*((100-zoomScale)/100)));
new_height = parseInt(origHeight) + parseInt(Math.round(origHeight*((100-zoomScale)/100)));
任何帮助将不胜感激！
I'm creating a "zoom" effect with a div with overflow:scroll. Here's my dillema:
I use the following:
$('#object').css({ 'transform':'scale(50)' });
Which works beautifully, but now I would like to mathematically resize the element to it's original width/height (keeping the scale at 50%, or whatever the value might be...)
$('#object').css({ 'width': ?+'px', 'height': ?+'px' });
Pretty sure this is a math issue, I can get close with the following:
new_width = parseInt(origWidth) + parseInt(Math.round(origWidth*((100-zoomScale)/100)));
new_height = parseInt(origHeight) + parseInt(Math.round(origHeight*((100-zoomScale)/100)));
Any help would be appreciated!
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（1）
你的数学是错误的。
但是...如果
700代表50%，那么100%将是1400而不是 700 + 350。 ..所以：
假设我的变量是获得相反保持缩放的数学将是：
数学公式将是：
对于原始值，您可以使用
csswidth或height它们仍然是像素原始值，缩放值修改后的值将是 clientWidth、clientHeight、offsetWidth 和 offsetHeight 元素属性。Your math is wrong.
But... if
700represent50%, then100%will be1400and not 700 + 350...So:
supose my vars are that the math to get the oposite keep zoom will be:
The math formula will be:
For the original values, you can use the
csswidthorheightthey will still the pixel original value, the modified by zoom value will be the clientWidth, clientHeight, offsetWidth and offsetHeight element properties.