大家好,
一系列不同大小图像均单独包装在水平滚动网页上的左侧 float 不同大小 div 中。我希望能够点击一个 div 将其缩放到全屏(通过添加一个包含缩放指令的 css 类,使用toggleClass),然后点击图像(现在是全屏,因此遮盖了 div)以返回到正常(通过从其包装 div 中删除该类)。
我找到了各种选项来对背景图像(具有已知大小)执行此操作,并且有不错的全屏画廊,但这个让我回避。
由于尺寸不同,我无法使用scale(2)或其他固定值。是否可以将 webkit-transform:scale 调整为目标尺寸(如 768x1024)而不是比例因子?
非常感谢!
最佳答案
您是否尝试过进一步简化它?尝试使用一些 JavaScript 来为单击时的对象分配高度、宽度和 z 索引。
基本上在点击时,写入页面:(或类似的东西)
height:100%;
width:100%;
z-index:999;
position:absolute;
关于css - 变换:scale to fullscreen?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/4016613/