图片轮播中每张图片上的文字

Question

我想更改图片轮播中每张图片的文字。我试过为每个图像使用单独的 <div>，但它仍然无法正常工作。这是图像轮播的类型：Space Gallery 源代码可用。我无法按要求实施。谁有可能的解决方案？

<div id="myGallery" class="spacegallery">
                <div>
                <img src="images/bw3.jpg" alt="" />
<!--This is my text that i want to put-->
                <p class="gh"><strong>Here</strong></p>
                </div>
                <img src="images/lights3.jpg" alt="" />
                <img src="images/bw2.jpg" alt="" />
                <img src="images/lights2.jpg" alt="" />
                <img src="images/bw1.jpg" alt="" />
                <img src="images/lights1.jpg" alt="" />
            </div>

我什至试过这个：

<div id="myGallery" class="spacegallery">
                    <div>
                    <img src="images/bw3.jpg" alt="" />
                  <span>  <marquee behavior="slide" direction="left">HTML slide-in text...</marquee></span>

                    </div>
                    <div>
                    <img src="images/lights3.jpg" alt="" />
                    <span><br/>Tadad</span>
                    </div>
                    <img src="images/bw2.jpg" alt="" />
                    <img src="images/lights2.jpg" alt="" />
                    <img src="images/bw1.jpg" alt="" />
                    <img src="images/lights1.jpg" alt="" />
                </div>
            </div>

css:

span{
    position:absolute;
    z-index:1;
    top:100px;
    left:30%;
}

Answer 1

为此，您需要使用另一个图库来支持自定义块。如果您查看 SpaceGallery 的代码 - 可以直接搜索 or 元素。

一种可能的解决方案是创建 javascript 函数并进行 after 回调（spaceGallery 支持）以创建和定位您的文本。

Answer 2

Spacegallery 插件无法实现。你必须使用另一个插件。

或者您可以将一件事添加到图像本身

Answer 3

Follow below url may be help.
    http://jsfiddle.net/technotarek/gXN2u/

图片轮播中每张图片上的文字

Text on each image in image carousel

html

css

jquery

carousel