2016-12-04 64 views
0

我正在使用CSS转换来扩展整个页面的项目。扩大了一点之后,来自角落的内容开始变得不可见,因为它们在可见范围之外。有没有办法通过使用变换缩放垂直滚动或水平滚动来使内容仍然可见?我目前使用Javascript功能来扩大身体像这样HTML正文CSS变换放大导致内容被删除

document.body.style.transform = 'scale(1.5)'; 

然而

,这切断了从网页的某些内容。我需要它继续工作,因为我从1.0开始继续扩展。

+0

你能否简要介绍一下为什么你甚至需要放大整个身体? –

回答

0

尝试调节变换产地:

document.body.style.transformOrigin = 'top left'; 
document.body.style.transform = 'scale(' + scaleFactor + ')'; 

您可能还需要调整机体的宽度和高度相匹配的缩放。

var scaleFactor = 1.5; 
document.body.style.transformOrigin = 'top left'; 
document.body.style.transform = 'scale(' + scaleFactor + ')'; 
document.body.style.width = 100 * scaleFactor + "%"; 
document.body.style.height = 100 * scaleFactor + "%"; 

有关变换的说明。变换是虚构的,不会改变物理尺寸,包括x,y,宽度和高度。所以你必须手动管理这些物理尺寸,以匹配你的“变换”尺寸,以保持滚动条的快乐。

+0

感谢您的transformOrigin建议。这使它更好。不幸的是,宽度和高度的变化扭曲了页面 – Coder