How does three.js change the transparency of the map?

I created a ball model, and then posted a picture on the model, and then slowly let the ball disappear, changing the transparency has no effect! Ask for advice

pay the complete code:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <script type="text/javascript" src="js/three.min.js"></script>
</head>
<body>
    <div id="WebGL-output"></div>

    <script type="text/javascript">
        var w = window.innerWidth - 30;
        var h = window.innerHeight - 30;
        
        var scene = new THREE.Scene();
        var camera = new THREE.PerspectiveCamera(40, w / h, 0.1, 1000);
        camera.position.set(50, 50, 50);
        camera.lookAt(scene.position);

        var renderer = new THREE.WebGLRenderer();
        renderer.setClearColor(new THREE.Color(0xcccccc));
        renderer.setSize(w, h);

        var axes = new THREE.AxisHelper(30);
        scene.add(axes);
        document.getElementById("WebGL-output").appendChild(renderer.domElement);

        // ----------------------------------------------------------------

        var img = THREE.ImageUtils.loadTexture("./img/tt4.png");        // 
        
        var sphereGeometry = new THREE.SphereGeometry(10, 32, 16);       //
        var sphereMaterial = new THREE.MeshBasicMaterial({
            map: img
        });
        var sphere = new THREE.Mesh(sphereGeometry, sphereMaterial);
        sphere.position.set(10, 10, 10);
        scene.add(sphere);


        // 
        setInterval(function () {
            sphere.rotateY(Math.PI / 180);
            renderer.render(scene, camera);
        }, 1000 / 60)
        
        // 1
        setTimeout(function(){
            console.log(sphereGeometry);
            setInterval(function(){
                //  ()
                sphereMaterial.opacity -= 0.05;
                sphere.material.opacity -= 0.05;
            }, 100)
        }, 1000)
    </script>
</body>

</html>

setTimeout(function(){ console.log(sphereGeometry); var timer = setInterval(function(){ // () console.log(sphereMaterial.opacity); console.log(sphere.material.opacity); // sphereMaterial.opacitysphere.material.opacity if(sphereMaterial.opacity > 0){ sphereMaterial.opacity -= 0.05; sphere.material.opacity -= 0.05; } else { sphere.material.transparent = true; clearInterval(timer); } }, 100) }, 1000)