Question

今天我正在使用滑块，效果就像褪色，我可以看到效果，但图像没有，我的意思是我把所有东西都放在一个div框中，我在css样式表中添加属性，但我只能看到div边距和阴影移动，但根本没有图像
这是javascript

//intervalo tiempo cambio img slide, 5 segundos, se llama a la función "avanzaSlide()"
setInterval('avanzaSlide()', 5000);

//array con las clases para las diferentes imagenes
var arrayimages = new Array(".img4", ".img5", ".img6", ".img7", ".img8", ".img9", ".img10");

//variable que nos permitirá saber qué imagen se está mostrando
var contador = 0;

//hace un efecto fadeIn para mostrar una imagen
function mostrar(img) {
  $(img).ready(function() {
    $(arrayimages[contador]).fadeIn(1500);
  });
}

//hace un efecto fadeOut para ocultar una imagen
function ocultar(img) {
  $(img).ready(function() {
    $(arrayimages[contador]).fadeOut(1500);
  });
}

//función principal
function avanzaSlide() {
  //se oculta la imagen actual
  ocultar(arrayimages[contador]);
  //aumentamos el contador en una unidad
  contador = (contador + 1) % 3;
  //mostramos la nueva imagen
  mostrar(arrayimages[contador]);
}

.proslider {
  border: 2px solid white;
  margin: auto;
  position: absolute;
  left: 40%;
  top: 80%;
  width: 80%;
  bottom: 50%;
  float: right;
  height: 70%;
}

.proslider img {
  width: 600px;
  height: 540px;
  position: absolute;
}

.proslider .img5,
.img6 .img7 .img8 .img9 .img10 {
  display: none;
}

figure {
  margin: 0;
}

<script src="js/slider.js"></script>
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>

<div class="proslider">
  <figure>
    <img class="img4" src="PROs/PR.jpg" alt="img4" />
    <img class="img5" src="PROs/PR2.jpg" alt="img5" />
    <img class="img6" src="PROs/PR.jpg" alt="img6" />
    <img class="img7" src="PROs/PR4.jpg" alt="img7" />
    <img class="img8" src="PROs/PR.jpg" alt="img8" />
    <img class="img9" src="PROs/PR6.jpg" alt="img9" />
    <img class="img10" src="PROs/P7.jpg" alt="img10" />
  </figure>
</div>

我所看到的只是一个盒子，有一个移动的效果，但没有别的我尝试改变分辨率，但没有。

基于Javascript的滑块不起作用

0 个答案: