各データ行にリンクがあるグリッドビューがあります。ユーザーがリンクをクリックすると、ポップアップ div が表示されます。ポップアップ div はページの特定の場所にありますが、グリッドビューに多数の行がある場合、ユーザーがページの下部までスクロールした後にリンクをクリックすると、ページの上部に div がポップアップします。ページを一番上に戻します。
クリックしたリンクがどこにあるのかを基準にして、ページ上に div を配置したいと思います。したがって、下にスクロールして gridview リンクをクリックすると、そこに div が表示されます。グリッドビューの上部にリンクがある場合は、上部にポップアップします。
これが私のコードです:
<script type="text/javascript">
function CopyRecords() {
document.all.CopyItemsDiv.style.display = 'block';
document.getElementById("outerdiv2").style.display = 'block';
}
function closeFrame2() {
document.getElementById("outerdiv2").style.display = 'none';
location.replace('default.aspx');
}
</script>
<div id="outerdiv2" style="position: absolute; top: 30px; left: 550px; filter: alpha(opacity=85); z-index: 1001; display: none; background-color: white; border: .125em solid #736F6E;">
<div style="text-align: right; padding: .25em .5em; font-size: 1.25em; border: outset 2px gray; margin-bottom: 4px; background-color: #cccccc;">
<span style="float: left; font-size: medium;">Import Budget</span>
<b><a href="javascript:closeFrame2();" style="cursor: pointer; color: Black;" title="close window">x</a></b></div>
<div id="CopyItemsDiv" style="height: 150px; width: 300px; border: none; margin-left: 15px;" >
Div Contents...
</div>
</div>