选中复选框时如何禁止“mouseenter”和“mouseleave”事件?
当复选框选中时,如何禁止 mouseenter
和 mouseleave
事件?
window.addEvent('domready',function() {
var z = 2;
var e = document.id('draggable');
var drag = new Drag.Move(e, {
grid: false,
preventDefault: true,
onStart: function() {
e.setStyle('z-index',z++);
}
});
//e.store('Drag', drag);
var w = e.getStyle('width');
var h = e.getStyle('height');
e.set("morph", {duration:700,delay:400}).addEvents({
mouseenter: function(){
this.store("timer", (function() {
this.morph({
width: '700px',
height: '500px',
opacity: [0.5, 1]
});
}).delay(1000, this));
},
mouseleave: function() {
var pin = this.store("timerB", (function() { //probably there is some missateke
this.morph({
width: w,
height: h,
opacity: [1, 0.5]
});
}).delay(1000, this));
$clear(this.retrieve("timer"));
}
});
});
function check(elem) {
var pin = document.id('draggable').retrieve('timerB');
if(elem.checked) {
pin.detach();
}
else {
pin.attach();
}
}
#draggable{
background-color: grey;
width: 300px;
height: 200px;
opacity: 0.5;
}
<input type="checkbox" onclick="check(this);">
<div id="draggable">Draggable DIV 1</div>
How to disallow mouseenter
and mouseleave
event when checkbox checked?
window.addEvent('domready',function() {
var z = 2;
var e = document.id('draggable');
var drag = new Drag.Move(e, {
grid: false,
preventDefault: true,
onStart: function() {
e.setStyle('z-index',z++);
}
});
//e.store('Drag', drag);
var w = e.getStyle('width');
var h = e.getStyle('height');
e.set("morph", {duration:700,delay:400}).addEvents({
mouseenter: function(){
this.store("timer", (function() {
this.morph({
width: '700px',
height: '500px',
opacity: [0.5, 1]
});
}).delay(1000, this));
},
mouseleave: function() {
var pin = this.store("timerB", (function() { //probably there is some missateke
this.morph({
width: w,
height: h,
opacity: [1, 0.5]
});
}).delay(1000, this));
$clear(this.retrieve("timer"));
}
});
});
function check(elem) {
var pin = document.id('draggable').retrieve('timerB');
if(elem.checked) {
pin.detach();
}
else {
pin.attach();
}
}
#draggable{
background-color: grey;
width: 300px;
height: 200px;
opacity: 0.5;
}
<input type="checkbox" onclick="check(this);">
<div id="draggable">Draggable DIV 1</div>
The code paste in http://jsfiddle.net/89RJp/4/
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
http://jsfiddle.net/89RJp/6/
你想要
if (element. get("checked")) return
在 mouseenter/mouseleave 回调的顶部。http://jsfiddle.net/89RJp/6/
you want
if (element.get("checked")) return
at the top of the mouseenter/mouseleave callbacks.