0

我现在正在处理一个网页,其中有一个介绍性标题,该标题显示在页面的前面,并带有一个文本侧边栏。

问题是我有几个标题,由于页面包含的图像和信息的数量,我想在不同的人访问我的页面时翻阅这些宏大的故事。

为此,我现在正在运行一个 JS 脚本,它可以自动更改 Image 标头而不会出现任何问题。但是,由于我最近决定为图像添加某种描述,我现在不仅需要更改图像,还需要更改文本。

这似乎很容易,但我向你保证不是,反正对我来说也不是。

这是脚本和受其影响的 html。

Javascript

(function(){
var rotator = document.getElementById('bigImage');
var imageDir = '../images/';
var delayInSeconds = 5;
var images = ['1.png', '2.jpg', '3.jpg', '4.jpg', '5.jpg', '6.jpg', '7.png'];
var num = 0;
var changeImage = function() {
var len = images.length;
bigImage.src = imageDir + images[num++];
if (num == len)
{num = 0;} 
};
setInterval(changeImage, delayInSeconds * 1000);
})();

HTML

<div class="image-container">       
<a href="../Html/1.html"><img src="../images/1.png" height="300"    
width="650" id="bigImage";/></a>

<div id="text">
<div id="text-box">
<p></p>
</div>
</div>  
4

1 回答 1

0

像这样的东西?

(function(){
  var rotator = document.getElementById("bigImage")
    , textBox = document.getElementById("text-box") //SELECT THE TEXT BOX
    , imageDir = "../images/"
    , delayInSeconds = 5
    , images = []
    , len = images.length
    , num = 0 //why this?
    , changeImage = function(delay){
      bigImage.src= imageDir + images[num++]
      textBox.innerhtml = "hello from image nr:"+num //SET TEXTBOX CONTENT
      if(num === len){
        num = 0 
      }
     }
}())
于 2012-10-15T14:04:35.277 回答