Question

我希望第一次点击它会在3秒后显示但是在点击后第一次点击它会在3秒之前显示

function Func1()
{

document.getElementById('div1').style.visibility = "visible" ;

}

function Func1Delay()
{

setTimeout("Func1()", 3000);

}

function Func2Delay()
{

document.getElementById('div1').style.visibility = "hidden" ;

}

Answer 1

你的英语或描述很差，但据我所知，你想要这样的东西：

var div = document.getElementById('div1'),t;
function changeStyle(element,prop,value){
    element.style[prop] = value;
}

function showDiv(){
    changeStyle(div,'opacity','1');
}

function hideDiv(){
    changeStyle(div,'opacity','0');
}

div.addEventListener('mouseover',function(){
    t = setTimeout(showDiv,3000);
},false);

div.addEventListener('mouseout',function(){
    clearTimeout(t);
    hideDiv();
},false);

这是一个演示：http://jsfiddle.net/gion_13/TSVA5/
你必须盘旋＆＃34;隐形＆＃34; div，它将在3秒后显示。

Answer 2

这对我有用

标记：

    <input type="button" value="clickme" onmouseout="ClearIntv()" onmouseover="DelayShow('showMe',5000)" />
    <div id="showMe" style="display:none;background-color:red;width:50px;height:50px;">

    </div>

脚本：

    var intv;
    function DelayShow(timeOutMs) {
        var elm = document.getElementById("showMe");
        var now = new Date().getTime();
        var end = now + timeOutMs;;
        intv = setInterval(function () {
            now = new Date().getTime();
            if (now >= end) {
                elm.style.display = "block";
                clearInterval(intv);
            }
        }, 500);
    }
    function ClearIntv() {
        clearInterval(intv);
    }

在MouseOver上激活计数器，并在MouseOut上取消

在鼠标悬停上显示Div

2 个答案: