Este artículo ha compartido el código detallado de la imagen JS que se desvanece y sale de cambio para su referencia. El contenido específico es el siguiente
<! Doctype html> <html> <fead> <meta charset = "utf-8"> <title> </title> <style type = "text/css"> *{relled: 0; margen: 0;} ul {Overflow: Hidden;} li {Lista de listas: Ninguna; altura: 30px; borde: 1px sólido #000; width: 100px; left;line-height: 30px;text-align: center;} img{width:306px;opacity: 0;} .active{background:yellow} </style> </head> <body> <ul> <li>Wang Baoqiang</li> <li>Ma Rong</li> <li>Song Ji</li> </ul> <img src=""/> </body> <script src = "public.js"> </script> <script type = "text/javaScript"> var oli = document.getElementsByTagName ("li"); var oimg = document.getElementsBytagName ("img") [0]; var arr = ['img/wbb.jpg', 'img/wlp.jpg', 'img/qs.jpg'] var time = null; var tiempo1 = nulo; para (i = 0; i <oli.length; i ++) {oli [i] .index = i; oli [i] .Onclick = function () {for (i = 0; i <oli.length; i ++) {oli [i] .classname = ""; } this.classname = "activo"; oimg.src = arr [this.index]; var num = 0; paso var = 2; ClearInterval (tiempo); ClearInterval (Time1); Time = setInterval (function () {num+= step; if (num> = 200) {num = 200; clearVal (time);} oimg.style.opacity = num/200;}, 20)}} </script> </html>Lo anterior es todo el contenido de este artículo. Espero que sea útil para el aprendizaje de todos y espero que todos apoyen más a Wulin.com.