JS实现的相册图片左右滚动完整实例(2)

var imgNum = $get("idContainer").getElementsByTagName("img").length; var pre = $get("Pre"); var next = $get("Next"); var i = 0; if (imgNum > 0) { var st = new SlideTrans("idContainer", "idSlider", 3, { Vertical: false }); if (i < 2) { $get("Next").onclick = function() { if (i < 2) { st.Next(); i++; if (i == 1) { $get("ImgPre").src = "ImageV3/Default/pre-green.png"; pre.style.color = "#2f6417"; } if (i == 2) { $get("ImgNext").src = "ImageV3/Default/next-gray.png"; next.style.color = "Gray"; } ChangePicIndex(i); } } } $get("Pre").onclick = function() { if (i > 0) { st.Previous(); $get("ImgNext").src = "https://www.jb51.net/ImageV3/Default/next-green.png"; next.style.color = "#2f6417"; i--; if (i == 0) { $get("ImgPre").src = "https://www.jb51.net/ImageV3/Default/pre-gray.png"; pre.style.color = "Gray"; } ChangePicIndex(i); } } st.Run(); } function ChangePicIndex(index) { switch (index) { case 1: $get("Img1").src = "https://www.jb51.net/ImageV3/Default/graydot.png"; $get("Img2").src = "https://www.jb51.net/ImageV3/Default/greendot.png"; $get("Img3").src = "https://www.jb51.net/ImageV3/Default/graydot.png"; break case 2: $get("Img1").src = "https://www.jb51.net/ImageV3/Default/graydot.png"; $get("Img2").src = "https://www.jb51.net/ImageV3/Default/graydot.png"; $get("Img3").src = "https://www.jb51.net/ImageV3/Default/greendot.png"; break default: $get("Img1").src = "https://www.jb51.net/ImageV3/Default/greendot.png"; $get("Img2").src = "https://www.jb51.net/ImageV3/Default/graydot.png"; $get("Img3").src = "https://www.jb51.net/ImageV3/Default/graydot.png"; } }

更多关于JavaScript相关内容感兴趣的读者可查看本站专题：《JavaScript切换特效与技巧总结》、《JavaScript查找算法技巧总结》、《JavaScript动画特效与技巧汇总》、《JavaScript错误与调试技巧总结》、《JavaScript数据结构与算法技巧总结》、《JavaScript遍历算法与技巧总结》及《JavaScript数学运算用法总结》