私は、何百ものDivを含むページを内部に持っています。すべてのdivは絶対座標で配置されます。ページは非常に大きく、通常のモニタに表示することはできません。 pageloadでページをズームアウトすると、ページ全体が表示されるので、テキストは小さくて読み込めません。タイムアウト後、ID値に基づいて指定されたdivに向かってズームインする必要があります。javascriptでズームする
これはできますか？
document.body.style.zoom=0.5;this.blur();
しかし、私は指定された項目にどのようにズームインします：
は、私は私が出てinitalズームのためにこれを使用することができます理解できますか？
編集：私は十分に明確ではありませんでした。一度ズームアウトするとズームインしたいのですが、ズームモーションでズームしたいので、ズームしたdivがどこにあるか知っています。ありがとう！
これはあなたの要求のために働くことがあります...
$('.myDiv').click(function() {
var top = '100px';
var left = '50px';
$('body').animate({zoom: '100%', scrollTop: top, scrollLeft: left});
});body {
-webkit-transition: all 0.3s ease;
-moz-transition: all 0.3s ease;
-o-transition: all 0.3s ease;
-ms-transition: all 0.3s ease;
transition: all 0.3s ease;
zoom: 100%;
}
body.out {
zoom: 50%;
}
.myDiv {
width: 200px;
height: 300px;
float: left;
background-color: red;
border: 1px solid black;
}
html,
body {
width: 100%;
height: 100%;
background-color: yellow;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE html>
<html lang="en">
<head>
<title>Test</title>
</head>
<body class="out">
<div class="myDiv"></div>
<div class="myDiv"></div>
<div class="myDiv"></div>
<div class="myDiv"></div>
<div class="myDiv"></div>
</body>
</html>
申し訳ありませんが、私は私が謝罪、十分に明らかにされていない可能性があります。メインの質問に編集を追加しました。 – sharkyenergy
@sharkyenergy私の更新された答えを確認してください。 –
ズーム部分は機能しますが、スクロール部分は動きません。それは常に左上の角にズームする.. – sharkyenergy