javascript - divを非表示にし、ホバー時に他のDIVを表示します

Question

ホバー時にdivを変更するにはどうすればよいですか？

これは私がやりたいことの例です：JS FIDDLE

Answer 1

本当にJSが欲しいですか？

<style>
    #container #divB{ display: none; }
    #container:hover #divB{ display: block; }
    #container:hover #divA{ display: none; }
</style>

<div id="container">
    <div id="divA">
        DIV A is visible until hover
    </div>
    <div id="divB">
        DIV B must show up after hover DIV A and DIV A must hide
    </div>
</div>

ワーキングフィドルhttp://jsfiddle.net/KtckK/

Answer 2

フィドルを更新しました。例ではjQueryを使用しています。

$('#divA').hover(

function () { // On mouse over
    $(this).hide(); // this references the div.
}

//function () { // On mouse out
//   $(this).show(); // this references the div.
//}
);

http://jsfiddle.net/eJ6Rq/11/

それがあなたが探しているものであるかどうか私に知らせてください。

Answer 3

jQueryを試すことができます。http：//jsfiddle.net/eJ6Rq/3/を参照してください。

$('#divA').hover(function(){$(this).hide(); $('#divB').show();});