Javascript 如何更改隐藏div上的幻灯片索引？

我不懂javascript，需要一些帮助。我有一个弹出的灯箱，但我无法更改幻灯片索引#-如果它不隐藏，它会工作。有办法解决吗？我有10张编号为1-10的灯箱图片，希望第一张弹出的图片是#10而不是#1

例如： -尝试更改“currentSlider”以在弹出时按降序显示

<script>
// Open the Modal
function openModal() {
  $('#myModal').toggleClass('mod-act');
  $("#popOverlay").fadeIn();
}

// Close the Modal
function closeModal() {
  $('#myModal').removeClass('mod-act');
  $("#popOverlay").fadeOut();
}

var slideIndex = 3;// MY ISSUE STARTS HERE
showSlides(slideIndex);

// Next/previous controls
function plusSlides(n) {
  showSlides(slideIndex += n);
}

// Thumbnail image controls
function currentSlide(n) {
  showSlides(slideIndex = n);
}

function showSlides(n) {
  var i;
  var slides = document.getElementsByClassName("mySlides");
  var dots = document.getElementsByClassName("demo");

  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", "");
}
slides[slideIndex-1].style.display = "block";
dots[slideIndex-1].className += " active";
}
</script>

//打开模型
函数openModal（）{
$（'#myModal'）。toggleClass（'mod-act'）；
$（“#popOverlay”）.fadeIn（）；
}
//关闭模式
函数closeModal（）{
$（'#myModal'）.removeClass（'mod-act'）；
$（“#popOverlay”）.fadeOut（）；
}
var slideIndex=3；//我的问题从这里开始
放映幻灯片（幻灯片索引）；
//下一个/上一个控件
函数加滑块（n）{
放映幻灯片（幻灯片索引+=n）；
}
//缩略图图像控件
功能当前幻灯片（n）{
放映幻灯片（幻灯片索引=n）；
}
功能演示幻灯片（n）{
var i；
var slides=document.getElementsByClassName（“mySlides”）；
var dots=document.getElementsByClassName（“演示”）；
如果（n>slides.length）{slideIndex=1}
如果（n<1）{slideIndex=slides.length}
对于（i=0；i

如果无法使用隐藏元素，则可以将“不透明度”设置为0而不是“无显示”，并将“绝对位置”设置为使它们位于同一行。

欢迎使用stackoverflow。请在你的问题中编辑你想要达到的效果-相同的编号，不管可见性如何？编辑-我有10张编号为1-10的图像用于灯箱，并寻找第一张弹出的图像为#10，而不是#1也不起作用-隐藏与此有关的东西会弄乱幻灯片索引#。已尝试显示：无，已尝试显示：阻止并将其拖离画布（左：-50%），已尝试不透明度：0-无工作。只是不断弹出#1个幻灯片-尝试将“currentSlider”更改为在弹出时按降序显示up@deebar抱歉，我试图理解您的意思，但我不确定是什么错误，所以我尝试更改OpenModel（）；当前幻灯片（1）到OpenModel（）；当前幻灯片（4），然后2到3，然后3到2，最后4到1，然后它工作正常，那么我缺少什么？