淡入淡出

淡出

css

#div1 {
            height: 300px;
            width: 300px;
            background: red;
        }

 

js

        function fadeOut() {
            var i = 1;
            var stop = setInterval(function(){
                i -= 0.1;
                document.getElementById('div1').style.opacity = i;
                if (i <= 0) {
                    clearInterval(stop);
                }
            },50);
        }
        fadeOut();

淡入同理

这里未包含IE的兼容