需要用jQuery 实现 在一个元素上鼠标移入延迟200毫秒触发事件,但是200不到则取消触发。用JS也可以 50
4个回答
展开全部
你好,
我猜你要的效果是,但鼠标在元素上快速移入移出的时候不触发元素的mouseover事件,而当鼠标移入元素,并停留超过200毫秒,便触发某些方法。
如果是这样,实现起来比较简单,看代码:
<div id="J_Square" style="margin: 0 auto;width: 300px;height: 300px;background-color: blue;"></div>
<script>
(function() {
var sq = document.getElementById('J_Square');
var _timer;
sq.onmouseover = function() {
if (_timer) {
clearTimeout(_timer);
}
_timer = setTimeout(function() {
sq.style.backgroundColor = 'red';
}, 200);
};
sq.onmouseout = function() {
if (_timer) {
clearTimeout(_timer);
_timer = null;
}
sq.style.backgroundColor = 'blue';
};
})();
</script>
演示效果为:默认蓝色方块,鼠标快速移入移出没有任何效果,鼠标移入并停留超过200毫秒,元素变为红色,鼠标移出恢复蓝色。
希望能解决你的问题。
展开全部
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8">
<title>Example</title>
<style type="text/css">
</style>
<script>
window.onload=function(){
var cb=document.getElementById("cb");
var lbl=cb.nextElementSibling||cb.nextSibling;
var promBox=document.getElementById("promBox");
var t=0;
cb.onmouseover=lbl.onmouseover=function(){
t=setTimeout(function(){
promBox.style.display="block";
},200);
};
cb.onmouseout=lbl.onmouseout=function(){
clearTimeout(t);
promBox.style.display="none";
};
}
</script>
</head>
<body>
<div><input id="cb" type="checkbox" /><label for="cb">记住密码</label></div>
<div id="promBox" style="font-size:12px;background-color:yellow;padding:10px 4px;float:left;display:none;">请不要在网吧等公用电脑中勾选此项!</div>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
这是可以实现,需要写一个定时器,在多长时间去触发就行
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
展开全部
你先告诉我你问的是个什么意思,我完全看不懂。哈哈哈哈哈
已赞过
已踩过<
评论
收起
你对这个回答的评价是?
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询