如何在设置超时期间删除图像
how to remove images during the setTimeout?
case FOCUS_AA:
if(keyCode == KEY_RIGHT){
focus = FOCUS_AB;
clearTimeout(a);
document.getElementById("background").style.display = "block";
document.getElementById("backLight").style.display = "block";
document.getElementById("treeBoard").style.display = "block";
document.getElementById("bImg").style.display = "block";
document.getElementById("aImg").style.display = "none";
document.getElementById("a0").style.display = "none";
document.getElementById('banana').play();
banana1();
function banana1(){
document.getElementById("bImg").style.display = "block";
document.getElementById("b0").style.display = "block";
/*var a = setTimeout(apple2, 1000);*/
b = setTimeout(banana2, 1000);
}
function banana2(){
document.getElementById("bImg").style.display = "block";
document.getElementById("b0").style.display = "none";
document.getElementById("b1").style.display = "block";
b = setTimeout(banana3, 1000);
}
function banana3(){
document.getElementById("bImg").style.display = "block";
document.getElementById("b1").style.display = "none";
document.getElementById("b2").style.display = "block";
b = setTimeout(banana4, 1000);
}
function banana4(){
document.getElementById("bImg").style.display = "block";
document.getElementById("b2").style.display = "none";
document.getElementById("b3").style.display = "block";
b = setTimeout(banana5, 1000);
}
function banana5(){
document.getElementById("bImg").style.display = "block";
document.getElementById("b3").style.display = "none";
document.getElementById("b4").style.display = "block";
b = setTimeout(banana6, 1000);
}
function banana6(){
document.getElementById("bImg").style.display = "block";
document.getElementById("b4").style.display = "none";
document.getElementById("b5").style.display = "block";
b = setTimeout(banana7, 1000);
}
function banana7(){
document.getElementById("bImg").style.display = "block";
document.getElementById("b5").style.display = "none";
document.getElementById("b6").style.display = "block";
b = setTimeout(banana8, 1000);
}function banana8(){
document.getElementById("bImg").style.display = "block";
document.getElementById("b6").style.display = "none";
document.getElementById("b0").style.display = "block";
b = setTimeout(banana8, 1000);
}
}else if(keyCode == KEY_BACK){
focus == FOCUS_A
window.location.href = 'Shop.html';
}
break;
case FOCUS_AB:
if(keyCode == KEY_LEFT){
focus = FOCUS_AA;
clearTimeout(b);
document.getElementById("background").style.display = "block";
document.getElementById("backLight").style.display = "block";
document.getElementById("treeBoard").style.display = "block";
document.getElementById("a0").style.display = "block";
document.getElementById("aImg").style.display = "block";
document.getElementById("bImg").style.display = "none";
document.getElementById("b0").style.display = "none";
document.getElementById('apple').play();
apple0();
function apple0(){
document.getElementById("aImg").style.display = "block";
document.getElementById("a0").style.display = "block";
a = setTimeout(apple1, 1000);
}
function apple1(){
document.getElementById("aImg").style.display = "block";
document.getElementById("a0").style.display = "none";
document.getElementById("a1").style.display = "block";
a = setTimeout(apple2, 1000);
}
function apple2(){
document.getElementById("aImg").style.display = "block";
document.getElementById("a1").style.display = "none";
document.getElementById("a2").style.display = "block";
a = setTimeout(apple3, 1000);
}
function apple3(){
document.getElementById("aImg").style.display = "block";
document.getElementById("a2").style.display = "none";
document.getElementById("a3").style.display = "block";
a = setTimeout(apple4, 1000);
}
function apple4(){
document.getElementById("aImg").style.display = "block";
document.getElementById("a3").style.display = "none";
document.getElementById("a4").style.display = "block";
a = setTimeout(apple5, 1000);
}
function apple5(){
document.getElementById("aImg").style.display = "block";
document.getElementById("a4").style.display = "none";
document.getElementById("a5").style.display = "block";
a = setTimeout(apple6, 1000);
}
function apple6(){
document.getElementById("aImg").style.display = "block";
document.getElementById("a5").style.display = "none";
document.getElementById("a0").style.display = "block";
a = setTimeout(apple6, 1000);
}
}else if(keyCode == KEY_RIGHT){
focus = FOCUS_AC;
clearTimeout(b);
document.getElementById('b_').style.display ='none';
document.getElementById("background").style.display = "block";
document.getElementById("backLight").style.display = "block";
document.getElementById("treeBoard").style.display = "block";
document.getElementById("c0").style.display = "block";
document.getElementById("cImg").style.display = "block";
document.getElementById("bImg").style.display = "none";
document.getElementById("b0").style.display = "none";
document.getElementById('cake').play();
cake1();
function cake1(){
document.getElementById("cImg").style.display = "block";
document.getElementById("c0").style.display = "block";
c = setTimeout(cake2, 1000);
}
function cake2(){
document.getElementById("cImg").style.display = "block";
document.getElementById("c0").style.display = "none";
document.getElementById("c1").style.display = "block";
c = setTimeout(cake3, 1000);
}
function cake3(){
document.getElementById("cImg").style.display = "block";
document.getElementById("c1").style.display = "none";
document.getElementById("c2").style.display = "block";
c = setTimeout(cake4, 1000);
}
function cake4(){
document.getElementById("cImg").style.display = "block";
document.getElementById("c2").style.display = "none";
document.getElementById("c3").style.display = "block";
c = setTimeout(cake5, 1000);
}
function cake5(){
document.getElementById("cImg").style.display = "block";
document.getElementById("c3").style.display = "none";
document.getElementById("c4").style.display = "block";
c = setTimeout(cake6, 1000);
}
function cake6(){
document.getElementById("cImg").style.display = "block";
document.getElementById("c4").style.display = "none";
document.getElementById("c0").style.display = "block";
c = setTimeout(cake6, 1000);
}
} else if(keyCode == KEY_BACK){
focus == FOCUS_B
window.location.href = 'Shop.html';
}
break;
这显示了使用 setTimeout 对图像进行动画处理。当我按"KEY_RIGHT"时：图像停止并显示下一个动画图像。但问题是图像与停止的图像和下一个图像重叠。按下下一步(FOCUS_AB(键时，如何删除所有已停止或以前的图像(FOCUS_AA(？
如果你要通过jQuery进行动画制作，你可以在所有动画上调用.stop((，并且对动画的始终操作是隐藏照片。这样，即使您处于动画的中间，动画也会停止，立即进行到最后，下一个动画也会停止。
相关文章：
- 只从DIV删除图像，而不是整个网站
- Jquery删除图像
- 图层删除(图像）;在 Kinetic.js 中不起作用
- 隐藏或删除图像 src=未定义
- 如何在 javascript 中添加和删除图像上的边框
- 如何在 IE 11 中删除图像映射中的虚线
- 动态.js单击画布外的按钮时从画布中删除图像
- jQuery:裁剪以删除图像数据并替换为新数据
- 取消文件上载时删除图像预览
- 使用数据库中的图像填充dropzone.js删除图像的问题
- 使用jQuery预览和删除图像
- Kendo TreeView-只向没有子节点的父节点添加删除图像图标
- 使用 DOM 方法删除图像元素
- 将鼠标悬停在图像上时删除图像标题
- 单击移除/删除图像
- 当图像未上传到渠道顾问时，请删除图像标记.请不要使用jQuery方法
- 如何在代码点火器框架中删除记录后从图像目录中删除图像
- 使用javascript功能删除图像
- 如何删除图像并动态跨越
- 如何从浏览器缓存中删除图像
