overflowで上へはみ出た部分も見れるようにする

Question

CSSでは　overflow:scrollを適用することで右下にはみ出た部分を見ることができますが、左上の部分もスクロールして見れるようにする方法はあるのでしょうか？

<div id="hoge">
  <img id="fuga"></img>
</div>

#hoge{
position:absolute;
top:0;
left:0;
width:100px;
height:100px;
overflow:scroll;
}

#fuga{
position:absolute;
top:0;
left:0;
width:50px;
height:50px;
scale:2;
}

Comments

[miyabi_pudding]

今どういう状況で、どうなれば理想なのか、キャプチャで構いませんので画像の掲載をお願いします。
文章だけだと、状況がよくわからないです。

Answer 1

あらかじめスクロール位置をしていしておくことで、「左上にスクロールする」を実現することはできます。

JavaScriptは以下、

$('#hoge').scrollTop(25);
$('#hoge').scrollLeft(50);

document.getElementById('hoge').scrollTo(100, 500);

CSSは以下です。

#fuga {
  position:absolute;
  top: 0;
  left: 0;
  width: 200px; /* #hogeよりも大きい値 */
  height: 200px; /* #hogeよりも大きい値 */
  /* scale: 2; */
}

やりたいことに合っていれば幸いです。

Answer 2

似たようなご質問に答えたことがありますが、マイナス座標へのスクロールはできないと思います。
HTML - スクロールしても左に動かないのはなぜでしょうか｜teratail