我用JS写了一个轮播动画,现在在一个页面有两个地方要调用这个方法,调用这个方法后,为什么两个地方的动画就失效了呢,求解!!!急!!!!!!

warmersen warmersen 墨衍会员 · AI 创作全网分发 墨衍智能分发 通过墨衍一键同步至各平台 可同步平台 CSDN微信公众号微博知乎掘金百家号博客园抖音小红书 你的文章也可以这样分发 墨衍会员 ¥399起/年,写一次发全网 我也要 + 加入社区
这个动画的方法,请大家不吝指教,多谢,急!!!!!!!!!
function initanimation(){

var oBox = document.getElementById("box");
var aUl = document.getElementsByTagName("ul");
var aImg = aUl[0].getElementsByTagName("li");
var aNum = aUl[1].getElementsByTagName("li");
var timer = play = null;
var i = index = 0;

//切换按钮
for (i = 0; i < aNum.length; i++)
{
aNum[i].index = i;
aNum[i].onmouseover = function ()
{
show(this.index)
}
}

//鼠标划过关闭定时器
oBox.onmouseover = function ()
{
clearInterval(play)
};

//鼠标离开启动自动播放
oBox.onmouseout = function ()
{
autoPlay()
};

//自动播放函数
function autoPlay ()
{
play = setInterval(function () {
index++;
index >= aImg.length && (index = 0);
show(index);
},5000);
}
autoPlay();//应用

//图片切换, 淡入淡出效果
function show (a)
{
index = a;
var alpha = 0;
for (i = 0; i < aNum.length; i++)aNum[i].className = "";
aNum[index].className = "current";
clearInterval(timer);

for (i = 0; i < aImg.length; i++)
{

aImg[i].style.opacity = 0;
aImg[i].style.filter = "alpha(opacity=0)";

}

timer = setInterval(function () {
alpha += 2;
alpha > 100 && (alpha =100);
aImg[index].style.opacity = alpha / 100;
aImg[index].style.filter = "alpha(opacity = " + alpha + ")";
alpha == 100 && clearInterval(timer)
},20);
}

}
...全文

相关推荐

评论 1
收藏 已收藏
分享
返回顶部
warmersen
Web 开发 81,108 成员 341,721 内容