javascript - JS幻灯片.长度。如何在幻灯片中显示所有图像

标签 javascript

我的幻灯片由 8 张图像组成,但只显示一张。我发现这与幻灯片的长度有关,但我只是不知道如何准确地改变它。我的js代码如下。

window.addEventListener('DOMContentLoaded',init,false);

function init(){
'use strict';

var slideIndex = 1;
showSlides(slideIndex);


function showSlides(n) {
  var i;
  var slides = document.getElementsByClassName("mySlides");
  var dots = document.getElementsByClassName("dot");
	console.log(slides.length);
  if (n > slides.length) {slideIndex = 1} 
  if (n < 1) {slideIndex = slides.length}
  for (i = 0; i < slides.length; i++) {
      slides[i].style.display = "none"; 
  }
  for (i = 0; i < dots.length; i++) {
      dots[i].className = dots[i].className.replace(" active", "");
  }
	
	console.log(slides,slides.length,slideIndex-1,slides[0]);
  
	slides[slideIndex-1].style.display = "block"; 
  dots[slideIndex-1].className += " active";
}

}

最佳答案

我注意到的一些问题:

  • 您只运行此代码一次,因此幻灯片不会更新。
  • 您永远不会增加或减少slideIndex

你可以做什么:

  • 在计时器上运行此命令以每隔几秒更新一次或在单击按钮时运行
  • 每次增加幻灯片索引以允许幻灯片更改。

如果您仍然遇到问题,请向我们提供更多信息。祝你好运

关于javascript - JS幻灯片.长度。如何在幻灯片中显示所有图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/55203447/

相关文章:

javascript - 如何使用 Javascript 保存静态变量,即使在刷新页面时也是如此

javascript - 如何隐藏sql生成表中的列? (php+jquery)

javascript - react JS Bootstrap JS 不工作

javascript - 在angularjs中动态创建隐藏字段

javascript - Angular 和 Asp.Net Mvc 错误

javascript - 将 Javascript 日期转换为 ASP.NET 日期格式

javascript - 如何更改 highcharts 中的导出文件名

javascript - .show() 方法没有像在 jquery 中应该的那样工作

javascript - 刷新 Angular 日期时间选择器

javascript - 检查javascript中的文本框是否为空