在JavaScript圖像滑塊中的圖像上顯示文本時出現問題
[英]Issue in displaying text over images in javascript image slider
問題描述
這是我的HTML頁面：
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="text/html;charset=UTF-8">
<title>Demo slider</title>
<link href="themes/1/js-image-slider.css" rel="stylesheet" type="text/css" />
<script src="themes/1/js-image-slider.js" type="text/javascript"></script>
</head>
<body>
<div id="sliderFrame">
<div id="slider">
<img src="images/image-slider-1.jpg" id="img1" alt="" />
<img src="images/image-slider-2.jpg" id="img2" alt="" />
<img src="images/image-slider-3.jpg" id="img3" alt="" />
<img src="images/image-slider-4.jpg" id="img4" alt="" />
<img src="images/image-slider-5.jpg" id="img5" alt="" />
</div>
</div>
<div id="custom_text">
<h1 style="color: blue;">Image 1 text</h1>
</div>
<div id="custom_text1">
<h1 style="color: blue;">Image 2 text</h1>
</div>
<div id="custom_text2">
<h1 style="color: blue;">Image 3 text</h1>
</div>
<div id="custom_text3">
<h1 style="color: blue;">Image 4 text</h1>
</div>
<div id="custom_text4">
<h1 style="color: blue;">Image 5 text</h1>
</div>
</body>
</html>
使用menucool的Javascript Image Slider庫： 鏈接到網站
我想在不同的圖像上顯示不同的文本，我嘗試過為div和img標簽提供絕對和相對位置，但無法實現輸出。
javascript滑塊功能是預定義的功能。我基本上想實現此功能
1 個解決方案
解決方案1
2 已采納 2014-07-11 10:43:09
這就是為什么您總是閱讀文檔的原因：
http://www.menucool.com/javascript-image-slider#view2
通過每個幻燈片圖像的alt屬性設置字幕。 如果圖像的格式設置為延遲加載的圖像，則其標題可以通過title或data-alt屬性定義：
的HTML
<img src="//placehold.it/250x250" id="img1" alt="Caption one" />
<img src="//placehold.it/249x249" id="img2" alt="Caption two" />
<img src="//placehold.it/251x251" id="img3" alt="Caption three" />
<img src="//placehold.it/248x248" id="img4" alt="Caption four" />
<img src="//placehold.it/252x252" id="img5" alt="Caption five" />
Javascript-通過文字顯示圖片
聲明:本站的技術帖子網頁，遵循CC BY-SA 4.0協議，如果您需要轉載，請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.