3

onmouseover を使用して要素 display = block を作成するスクリプトがあります

<script language="JavaScript">
function aaa() 
{
    document.getElementById('cat').style.display = "block";
}
</script>

<a href='#' onmouseover='aaa()'>hover on me</a>

<div  id='cat' style='display:none;'>this will show</div>

マウスが上にないときに、その要素を元の表示プロパティ(なし)に戻したいと思いました

"<a href='#' onmouseover='aaa()'>hover on me</a>"

これどうやってするの?

4

5 に答える 5

7

そこでonmouseoutイベントです

function bbb() 
{
    document.getElementById('cat').style.display = "none";
}

...

<a href='#' onmouseover='aaa()' onmouseout='bbb()'>hover on me</a>
于 2012-09-05T06:01:12.313 に答える
3

デモ: http: //jsfiddle.net/TRxRV/1/

HTML:

<a href='#' onmouseover='show();' onmouseout='hide();'>hover</a>
<div  id='cat' style='display:none;'>cat</div>​

JavaScript:

window.show = function () {
    document.getElementById('cat').style.display = "block";
}

window.hide = function () {
    document.getElementById('cat').style.display = "none";
}
于 2012-09-05T06:03:20.860 に答える
3

これはあなたを助けるはずです...

                function aaa()
                {
                    document.getElementById('cat').style.display = "block";
                }
                function bbb()
                {
                    document.getElementById('cat').style.display = "none";
                }

        <a href='#' onmouseover='aaa()' onmouseout="bbb();">hover on me</a>
        <div id='cat' style='display: none;'>this will show</div>
于 2012-09-05T06:05:03.230 に答える
3

例として提供された同じコードを検討しています。onMouseout() 関数内に元の表示プロパティを含めると、マウスが上にないときに元のプロパティに戻ります。

<script language="JavaScript">
function aaa() 
{
    document.getElementById('cat').style.display = "block";
}
function bbb()
{
//include the code TO CHAGE THE PROPERTY HERE
document.getElementById('cat').style.display = "      ";
}
</script>

<a href='#' onmouseover='aaa();' onmouseout="bbb();">hover on me</a>

<div  id='cat' style='display:none;'>this will show</div>
于 2012-09-05T06:06:18.900 に答える
2

そのためにイベントを使用する必要がありますonMouseOut。コードは次のようになります。

<a href='#' onmouseover='show();' onmouseout='dontShow();'>hover</a>
<div  id='cat' style='display:none;'>this will show</div>​



function show() {
    document.getElementById('cat').style.display = "block";
}

function dontShow() {
    document.getElementById('cat').style.display = "none";
}
于 2012-09-05T06:02:42.047 に答える