想象一下远处看起来很远的一堆图像,无论你点击什么,它都会使用鼠标X,Y作为锚点放大。所以基本上所有的图像,无论它们是如何安排的(可能在不同的DIV中),都可以无缝放大,就好像相机放大了拼贴画一样。
我很难想到如何在jQuery中完成这项工作。有什么建议吗? CSS3动画过渡可能吗?注意:缩放时必须完全保留图像质量
答案 0 :(得分:0)
这是一个相当新的标准,但使用CSS的zoom
属性,您可以使用一点点javascript放大页面内容,甚至是特定元素。
此示例将在单击页面时展开wrapper
元素及其所有内容。
<div id="wrapper">
<div id="someContent"></div>
<img src="img.png" />
</div>
<script>
document.body.addEventListener
("click", function(){zoom(document.getElementById("wrapper"))}, true);
function zoom(elem) {
var zAtt = parseFloat(elem.style.zoom);
if(isNaN(zAtt)) zAtt = 100;
zAtt+=4;
console.log(zAtt);
console.log(elem);
elem.style.zoom = zAtt + "%";
}
</script>