画像ボタンの上にマウスを置くと、div をオーバーレイするスクリプトがあります。
これは 1 つのインスタンスではうまく機能しますが、(mysql ループで) 結果が複数ある場合、オーバーレイ ボックスは一番上の結果にとどまります。最初の結果だけでなく、リストされた各結果でこれをフォローしてジャンプダウンするにはどうすればよいですか? リストの下の各ボタンにマウスオーバーすると、ポップアップが表示されますが、下に移動しないのはポップアップの位置です。
これは絶対位置と相対位置などに関係していると確信していますが、それらを変更すると、スクリプトが機能しなくなります。このオーバーレイ機能に代わるものがあるかどうかわかりませんか?
最終的な結果として、クライアントに表示される結果のリストができました。各リストには、マウスオーバーしてメモを表示できるボタンがあります。
// ループ内にある div...
<div style="float:left; position: relative;" onmouseover="callMouseOver()" onmouseout="callMouseOut()">
<img style="padding:0 12px 0 12px;" src="/images/llm/button-account-notes.png">
<div id="child" class="areas_served_container shadow">
pop up content
</div>
</div>
// フッターにあるスクリプト
<script language="javascript">
function callMouseOver(){
document.getElementById("child").style.display = "inline";
}
function callMouseOut(){
document.getElementById("child").style.display = "none";
}
</script>
// オーバーレイする div のスタイル シート
.areas_served_container {
display: none; position: absolute;
top:44px; left:94px;
z-index:999px;
width:350px; padding:20px;
}