0

にカーソルを合わせると、作成して表示しようとしていdiv2ます。div3div1

ここに jsfiddle があります: http://jsfiddle.net/AbEZm/

HTML:

<div onMouseOver="show()" onMouseOut="hide()">Div 1 Content</div>
<div id="div2" style="display: none;>Div 2 Content</div>
<div id="div3" style="display: none;>Div 3 Content</div>

JavaScript:

function show() {
    document.getElementById('div2', 'div3').style.display = 'block';
}

function hide() {
    document.getElementById('div1').style.display = 'none';
}

ただし、これらの関数は div2 と div3 を表示しません。なにが問題ですか？

4

2 に答える 2

1

JavaScript を使用する代わりに、css を使用します。

HTML:
<div id="div1">div1</div>
<div id="div2">div2</div>

CSS:

#div2{
    opacity: 0;
    transition: opacity .4s;
    -moz-transition: opacity .4s; /* Firefox 4 */
    -webkit-transition: opacity .4s; /* Safari and Chrome */
    -o-transition: opacity .4s; /* Opera */
}
#div1:hover + #div2{
    opacity: 1;
}
于 2013-05-17T03:26:59.340 に答える
0

に 2 つの引数を渡すことはできませんgetElementById。"また、style属性の を閉じていないため、HTML が無効でした。

あなたが何を達成しようとしているのか正確にはわかりませんが、コードを修正して動作させるようにしました...

http://jsfiddle.net/AbEZm/2/

ただし、より良い代替手段は、:hover CSS セレクターを使用することです。

于 2013-05-17T03:22:50.300 に答える