0

そこで、絶対位置と相対位置のこつをつかもうとしてきました。この件については多くのチュートリアルや質問があり、私はそれらを理解するために最善を尽くしました. この一点を除いて、私はそれでおおむね良好です。ユーザーがクリックして画像を拡大するオプションがある小さなサムネイル画像があるページを作成しています。これを行うには、ユーザーが画像をクリックしたときにのみ表示される大きな画像を含む非表示レイヤーを使用しています。私はこの部分がうまく機能するようになりました。私の問題は、ページを下にスクロールして画像をクリックすると、非表示のdivが表示される前にスクロールバーがページの上部にジャンプすることです。絶対配置（divアンカーではなく、ウィンドウに対して）を使用した場合にのみこれが行われたという印象を受けました。望むところに現れる、しかし、それは画面の上部にジャンプします。私は周りを見回しましたが、正確な問題の解決策を見つけることができません。前もって感謝します。

HTML/CSS コード:

<a href="#" onclick="enlarge2()">
<img src="http://www.myadverket.com/images/smallemail.png" style="border: 2px solid  
#E0E0E0">
</a>
<div style="position: relative">
<div id="image2" style="position: absolute; top: 0px; right: 200px; width: 100%;  
height: 100%; vertical-align: middle; visibility: hidden">
....Content....
</div>
</div>

Javascript:

function enlarge2() {
var image = document.getElementById("image2");
image.style.visibility = "visible";
}
4

1 に答える 1

0

違いを見ます

<script>
    function test(){
        //onclick event stuff 
    }
</script>
<div style="height:3000px">a</div>
<a href="#" onclick="test(); return false;"> link1 <!-- will work as expected --> </a> 
<a href="#" onclick="test();">link2 <!--will scrollup --> </a>
<a id="cometome" href="#" onclick="test(); return false;"> link3 <!-- will not scroll --> </a>
<div style="height:3000px">b</div>
<a href="#cometome">scroll to link3!</a>
<a href="#">scroll to top!</a>
于 2013-04-24T23:43:57.750 に答える