淡入淡出js代码


var autoPlay=function(parentID,childTag) {
        var pictures = document.getElementById(parentID);
        var items = pictures.getElementsByTagName(childTag);
        var len=items.length;
        var index = 0;
        showItem();
        // 显示一张图片
        function showItem() {
            // 首先将所有图片透明度设为0,再继续单独改变一张图片的opacity
            hideItems();
            items[index].style.opacity = 1;
            // 将要显示的透明度改变让其显示
            if (index > len - 2) {//对index进行变化,这一步是当index到头的时候,切换到第一张
                index = 0;
            } else {
                index++;//index加一
            }
            // 在这里用setTimeout模拟setInterval的效果
            setTimeout(showItem, 4000);//每隔4s调用一次showItem,
        }
        // 将所有图片透明度设为0
        function hideItems() {//隐藏全部图片的代码
            for (var i = 0; i < len; i++) {//遍历处理,对每张图片都进行隐藏
                items[i].style.opacity = 0;
            }
        }
    };

  

原文地址:https://www.cnblogs.com/qianduangaoshou/p/6505461.html