<div id="openwin2" onmouseover="document.getElementById('opendiv').style.display='block';" onmouseout="document.getElementById('opendiv').style.display='none';">鼠标放上超过1s后弹出DIV</div>
<div id="opendiv">你已经在上面呆了1秒了!</div>
您好,请问这个延迟的时间能不能长一点。
延迟执行,一般是用定时器,定时器有两种,一种是setInterval,另一个是setTimeout。
setInterval,是间隔执行,次数为无限次。
setTimeout,是隔一段时间,执行一次。
setInterval() 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式。
setInterval() 方法会不停地调用函数,直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。
setTimeout() 和setInterval() 几乎是一样的,仅执行次数不同和单词不同而已。关闭setTimeout() 是用clearTimeout();
下面举一个setInterval的例子,仅供参考:
<style>
div width:100px; height:100px; position:absolute; top:50px; left:50px; background:#ccc;
</style>
<script>
window.onload=function()
var oDiv = document.getElementById(\'div1\');
var nLeft = parseInt(oDiv.currentStyle?oDiv.currentStyle.left:getComputedStyle(oDiv,false).left);
var timer = setInterval(function() //开启定时器,
nLeft++;
document.title=nLeft;
oDiv.style.left=nLeft+\'px\';
if(nLeft == 500)
clearInterval(timer); //当left值为500时,关闭定时器。
,30);
;
</script>
</head>
<body>
<div id="div1"></div>
众所周知,在手机上的点击事件会有延迟300ms的问题。但在做手机端某些点击小游戏时,我们就需要取消这个延迟的问题;
第一步:禁止页面的缩放
- <meta name="viewport" content="width=device-width user-scalable= ‘no‘">
这块内容能解决一些部分手机的问题
第二步: fastclick.js
FastClick 是 FT Labs 专门为解决移动端浏览器 300 毫秒点击延迟问题所开发的一个轻量级的库。简而言之,FastClick 在检测到touchend事件的时候,会通过 DOM 自定义事件立即触发一个模拟click事件,并把浏览器在 300 毫秒之后真正触发的click事件阻止掉。使用方法如下。
1:在页面中引入fastclick.js文件。
2:在js文件中添加以下代码
在 window load 事件之后,在body上调用FastClick.attach()即可。
window.addEventListener(function(){
FastClick.attach( document.body );
},false );
如果使用了jquery插件
$(function() {
FastClick.attach(document.body);
});
我这边代码用到的
<script src="js/fastclick.js"></script>
// 处理移动端 click 延迟
if (‘addEventListener‘ in document) {
document.addEventListener(‘DOMContentLoaded‘, function() {
FastClick.attach(document.body);
}, false);
}