幻灯片中的字幕图片

时间:2017-05-04 22:38:55

标签: javascript

我有以下代码,其中在Web浏览器中无法看到每个图像的标题,只是第一个。我需要看到每张图片都有自己的标题。



var curimage = 0;
var frequency = 2000;


function showSlideNum() {
  document.getElementById('slide').value = curimage;

}

function showNext() {
  curimage++;
  if (curimage > 7) {
    curimage--;
    alert('This is last picture in the catalog');
  }
  document.images.slide.src = 'images/casting' + curimage + '.jpg';
  showSlideNum();
}


function showPrev() {
  curimage--;
  if (curimage < 1) {
    curimage++;
    alert('There is no more picture before this one!!!');

  }
  document.images.slide.src = 'images/casting' + curimage + '.jpg';
  showSlideNum();
}

function clearImage() {
  curimage = 0;
  showSlideNum();
}

function setfrequency(newFrequency) {
  frequency = newFrequency;
  alert(frequency);
}

function showAuto() {
  curimage++;
  if (curimage > 7) {
    curimage = curimage
  }
  document.images.slide.src = 'images/casting' + curimage + '.jpg';
  showSlideNum();
  setTimeout('showAuto()', frequency);
}

function showStop() {
  document.location = document.location;
}
&#13;
<link rel="stylesheet" href="main.css">
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="slide_show.js"></script>

<body>
  <section>
    <h1>Fishing Slide Show</h1>
    <h2 id="caption">Casting on the Upper Kings</h2>
    <img id="slide" src="images/casting1.jpg" alt="">
    <div id="slides">
      <img src="images/casting1.jpg" alt="Casting on the Upper Kings">
      <img src="images/casting2.jpg" alt="Casting on the Lower Kings">
      <img src="images/catchrelease.jpg" alt="Catch and Release on the Big Horn">
      <img src="images/fish.jpg" alt="Catching on the South Fork">
      <img src="images/lures.jpg" alt="The Lures for Catching">
    </div>
    <div id="buttons">
      <input type="button" id="prev" value="Previous" onclick=showPrev()>
      <input type="button" id="pause" value="Pause" onclick=showStop()>
      <input type="button" id="play" value="play" onclick=showAuto()>
      <input type="button" id="next" value="Next" onclick=showNext()>
    </div>
  </section>
&#13;
&#13;
&#13;

我尝试使用不同的方法修复它并在Google中进行搜索但却无法理解如何修复它。

0 个答案:

没有答案