JS代码，求解释

发布网友 发布时间：2022-04-21 22:11

我来回答

共2个回答

热心网友 时间：2023-08-16 10:30

/*假设aNum为ul或者div的数组*/

/*假设你获取的a为当前li或者div的索引值则：*/

function show (a){

// index赋值当前索引

index = a;

// 设定alpha初始化number，值为0

var alpha = 0;

// 循环所有栏目aNum并清空每个栏目的class值

for (i = 0; i < aNum.length; i++)aNum[i].className = "";

// 设置触发的当前事件获取到的a也就是当前索引的class为current

aNum[index].className = "current";

// 清除时间戳timer

clearInterval(timer);

// 循环数组aImg，将每个aImg的值设为透明属性（也就是不可见），其中filter属性为兼容ie属性

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

{

aImg[i].style.opacity = 0;

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

}

// 设置时间戳 

// 将aImg[i]的值从第一个到最后一个累+2成长透明度 最大值100；如果大于100 则清除时间戳

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);

}

};

热心网友 时间：2023-08-16 10:31

<script>
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();
}
//自动播放函数 图片每隔3秒切换一次 每次执行一次show(a),实现淡入淡出。
function autoPlay() {
play = setInterval(function() {
index++;
index >= aImg.length && (index = 0); // 可以这样写 if(index >= aImg.length){index = 0;}
show(index);
},3000);
}
autoPlay();
// 图片切换 淡入淡出效果
function show(a) { // 假设你获取的a为当前li或者div的索引值则：
index = a; // index赋值当前索引
var alpha = 0; // 设定alpha初始化number，值为0
for(var i = 0; i < aNum.length; i++) {
aNum[i].className = ""; // 循环所有栏目aNum并清空每个栏目的class值
}
aNum[index].className = "current"; // 设置触发的当前事件获取到的a也就是当前索引的class为current
clearInterval(timer); // clearInterval() 方法取消由 timer = setInterval() 函数设定的定时执行操作。
// 循环数组aImg，将每个aImg的值设为透明属性（也就是不可见），其中filter属性为兼容ie属性
for(var i = 0; i < aImg.length; i++) {
aImg[i].style.opacity = 0;
aImg[i].style.filter = "alpha(opacity = 0)";
}
timer = setInterval(function() {// 设置按照指定的周期（以毫秒计）来调用函数或计算表达式,setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。
// 将aImg[i]的值从第一个到最后一个累+2成长透明度 最大值100；如果等于100 ，clearInterval() 方法取消由 setInterval() 函数设定的定时执行操作。
alpha += 2;
alpha > 100 && (alpha = 100);
aImg[index].style.opacity = alpha / 100;
aImg[index].style.filter = "alpha(opcity = " + alpha + ")";
alpha == 100 && clearInterval(timer);
},50);
}
</script>