javascript函数在2 mouseevent条件后运行

时间:2013-05-07 17:57:08

标签: javascript

我有3个盒子:kotak1,kotak2和kotak3。

#kotak1有测试"COBA AKU"

CSS:

<style>
    body {
        margin: 0;
        padding: 0;
    }
    #mainCont {
        margin: 0 auto;
        width: 1024px;
        height: 768px;
        background-color: #F00;
    }
    #kotak1{
        width: 1024px;
        height: 768px;
        background-color: #0F9;
        text-align: center;
        vertical-align: middle;
    }
    #kotak2{
        width: 240px;
        height: 768px;
        background-color: #666;
        float: left;
    }
    #kotak3{
        width: 240px;
        height: 768px;
        background-color: #03F;
        float: right;
    }
</style>

HTML:

<body>
    <div id="mainCont">
        <div id="kotak2"></div>
        <div id="kotak3" onmouseout="keluarkotak()"></div>
        <div id="kotak1">
            COBA AKU
        </div>
    </div>
</body>

当您从#kotak1鼠标移出并输入"SELESAI TIDUR"时,我想将#kotak3中的文字更改为#kotak2

1 个答案:

答案 0 :(得分:0)

这是一个小提琴:http://jsfiddle.net/PZfwT/1

这是支持代码,只管理你是否已经离开三个,然后当你的鼠标进入2时你可以改变1的文本。我建议用jQuery做这个,如果这样做的话,整体管理会更容易。

(function() {
    var mousedOutThree = false;

    window.App = {
        kotak2In: function() {
            if (mousedOutThree) {
                mousedOutThree = false;
                document.getElementById("kotak1").innerHTML = "SELESAI TIDUR";   
            }
        },

        kotak3Out: function() {
            mousedOutThree = true;
        }
    };
})();