如果在一定时间内(5秒)未点击网站上的其他图片(.stickman
),我想要一张图片(fadeIn
)到.lighSwitchOff
。我找不到任何具体的帮助。 .click
是否存在相反的情况?
如:
$(".lightSwitchOff").notclicked(5000 (function(){
$(".stickman").fadeIn();
});
答案 0 :(得分:1)
要执行此操作,您可以使用计时器在指定时间后淡入.stickman
元素,并在单击.lighSwitchOff
元素时清除该计时器,如下所示:
var timer = setTimeout(function() {
$('.stickman').fadeIn();
}, 5000);
$('.lighSwitchOff').click(function() {
clearTimeout(timer);
});
答案 1 :(得分:0)
首先在点击事件上设置变量或数据属性。
假设我正在设置窗口变量
window.info = true;
$(".lightSwitchOff").click(function() {
window.info = false;
});
现在使用setTimeout
setTimeout(function() {
if (window.info) {
$(".stickman").fadeIn();
}
}, 6000);
答案 2 :(得分:0)
您可以编写自己的插件,如下所示,扩展jQuery。
$.fn.notClicked = function(options, callback) {
var $this = this;
$this.timeOut = setTimeout(function() {
if (typeof callback == 'function') { //check if callback param is a function
callback.call(this); //trigger callback
}
}, options);
$(this).click(function(){
clearTimeout($this.timeOut);
});
}
$(".lightSwitchOff").notClicked(5000, function() {
$(".stickman").fadeIn();
});
<强> Demo 强>
答案 3 :(得分:0)
尝试类似https://jsfiddle.net/n9vj0hzp/
的内容<强> HTML 强>
.stickman{
display:none;
}
<强> CSS 强>
$(document).ready(function(){
var count=0;
$('.lighSwitchOff').on('click', function(){
count=1;
});
setTimeout(function(){
if(count==0)
$('.stickman').fadeIn();
}, 5000);
});
<强>的jQuery 强>
program files/mongodb/server/3.2/bin