滑动图像和文本

时间:2014-04-09 10:25:43

标签: javascript html css

我已经完成了滑动图像

<html>
<head>
<script language="JavaScript"> var i = 0; 
var path = new Array(); 
var i = 0; var path = new Array(); 
 path[0] = "one.jpg";
 path[1] = "two.jpg"; 


function swapImage() { 
document.slide.src = path[i];

if(i < path.length - 1) i++; else i = 0;

setTimeout("swapImage()",3000);

 } 
 window.onload=swapImage;
 </script>
 </head>
 <body>
<img height="200" name="slide" src="image_1.gif" width="400" />
</body>
</html>

但现在我尝试添加2个文本

                          one is   "Good Day" it place on First(one) image

                          second is "bad day" it place on Second(two) image

但我不知道如何开始“幻灯片图片和文字”

我想要像下面的图像一样添加文字
                               “这是一个标题”

enter image description here

1 个答案:

答案 0 :(得分:0)

请查看以下链接:

http://wowslider.com/web-photo-gallery-subway-basic.html

http://www.trans4mind.com/personal_development/JavaScript/imageSlideShow.htm

您可以添加div代码并在其中放置text此代码的另一个解决方案:

<div>
    <img src="images/thumbnail-slider-1.jpg" />
    <div class="myCaption">blah, blah, blah</div>
</div>

用包含的块包装每个图像,并将图像和标题放在包装器中。

请参阅此帖子:nivo slider - add text to the slider