11-项目：JS实现轮播图特效
2021-04-25 16:28
标签：size 技术 this attribute src 自定义 去除 ie8 上下 btn.onclick 等同于 btn[“onclick”] //任何的 . 都可以用[” “]代替 ie9或以上的透明度用opcity : .8 ；ie8及以下用filter:alpha(opcity=80) 1、定义一个全局变量a，表示当前图片的索引 2、获取当前有多少张图片pics，pics.length 3、点击下一张，a++，如果a>=pics.length，那么a=0 4、用for循环把所有的图片隐藏，所有的的小圆点取消高亮 5、a就是当前图片、小圆点的索引，用pics[a].style或className，就可以显示出来 1、用size表示有多少个圆点 2、用for循环，size作为循环次数。内部dots[d].id = d，给dot添加id值 3、给每一个小圆点绑定事件，a = this.id，当前的id赋予a，再根据a来切换图片 1、设置一个全局变量timer=null 2、封装一个函数，里面 timer = setInterval(function(){index++; 3、调用该函数 4、当鼠标进入图片区域，清除间歇调用timer 5、当鼠标离开图片区域，继续调用轮播函数 1、遍历出主菜单的每一行，并给它添加上自定义属性menuItems[m].setAttribute(“data-index”,m)，并给每一行绑定函数 2、鼠标滑过主菜单的标题，获取自定义属性的值idx 3、把所有子菜单遍历出来，并隐藏，把索引值等于idx的子菜单显示 4、鼠标滑过主菜单，把所有主菜单标题背景去除，把索引值等于idx的设置背景 5、鼠标离开主菜单，子菜单隐藏 6、鼠标进入子菜单，子菜单显示 7、鼠标离开子菜单，子菜单隐藏 11-项目：JS实现轮播图特效 标签：size 技术 this attribute src 自定义 去除 ie8 上下 原文地址：https://www.cnblogs.com/mingliangge/p/12207688.html一、焦点图结构及样式
二、主菜单
三、子菜单
四、上下一张按钮，及小圆点高亮
五、点击小圆点跳转到相应的图片
六、自动轮播与清除自动轮播
if(index>=size) index=0;
change();//更换图片
},3000);七、子菜单显示与隐藏
上一篇：JS——表格的隔行换色
下一篇：CSS布局的三种机制