慕雪4427196
2016-03-18 10:03
是这样的,我按老师教的写了div的匀速运动函数,又写了div的透明度变化函数。我想把两个效果一起DOM给onmouseover,结果发现只能触发一个函数,谁写在前面触发谁。这怎么办啊,难道onmouse只能有一个动画效果吗?
-----------我是分割线-------------------------------------------------------------------
window.onload = function() {
var close = document.getElementById('menu');
function class1() {
startMove(0),
startOpactiy(100);
}
function class2() {
startMove(-200),
startOpactiy(30);
}
close.onmouseover = function() {
class1()
};
close.onmouseout = function() {
class2()
}
}
var timer = null;
var alpha = 30;
function startMove(ev) {
var close = document.getElementById('menu');
clearInterval(timer);
var speed = 0;
timer = setInterval(function() {
if (close.offsetLeft < ev) {
speed = 10;
} else {
speed = -10
}
if (close.offsetLeft == ev) {
clearInterval(timer)
} else {
close.style.left = menu.offsetLeft + speed + 'px'
}
}, 30)
}
function startOpactiy(target) {
var close = document.getElementById('menu');
clearInterval(timer);
var speed = 0;
timer = setInterval(function() {
if (alpha > target) {
speed = -10;
} else {
speed = 10;
}
if (alpha == target) {
clearInterval(timer)
} else {
alpha += speed;
close.style.filter = 'alpha(opacity=' + alpha + ')';
close.style.opacity = alpha / 100;
}
}, 30)
}
不好意思已经解决了,原来需要两个定时器。。。。哈哈哈哈哈
JS动画效果
113925 学习 · 1443 问题
相似问题