gracias, solo una cosa y perdona que moleste, si hago la prueba de los cambios en en mismo jsfiddle.net si puedo ver las imagenes pero si lo hago en local aparece la pantalla en blanco, este es el archivo html
Código HTML:
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Documento sin título</title>
<style type="text/css">
div a{
position: absolute;
opacity: 0;
transition: .4s;
}
</style>
<script type="text/javascript">
var div = document.getElementById("slider"),
img = div.getElementsByTagName("a"),
total = img.length,
i = 0,
slider = function(){
img[i].style.opacity = 0;
i = i == total - 1 ? 0 : ++i;
img[i].style.opacity = 1;
},
interval = null;
img[i].style.opacity = 1;
div.addEventListener("mouseover", function(){
slider();
interval = setInterval(slider, 1500);
}, false);
div.addEventListener("mouseout", function(){
clearInterval(interval);
});
</script>
</head>
<body>
<div id = "slider">
<a href="http://yahoo.com">
<img src = "http://www.circuito.mx/images/Presa_Brockman_01.jpg" />
</a>
<a href="http://google.com">
<img src = "https://blogdepelusita.files.wordpress.com/2012/06/img201010091724205.jpg?w=590" />
</a>
<a href="http://facebook.es">
<img src = "http://www.fincabarcelona-mallorca.com/images/portfolio/actividades-rurales-mallorca.jpg" /></a>
<a href="http://live.com">
<img src = "https://lh3.googleusercontent.com/-Njmduuanh-0/UkpT2-GRNkI/AAAAAAAAKtI/AWqIfTWo1DU/s0/photo.jpg" /></a>
</div>
</body>
</html>