0

我有一个词，单击它会在灯箱中显示该词的图像...当您单击另一个图像时，它会将该 div 中显示的词更改为另一组词。在第一次加载灯箱工作，但一旦你改变了灯箱不工作的话，它会加载一个单独的页面，其中包含图片。

$(function() {
$('#thmb1').click(function() {
var bigImg = document.getElementById("bigImg");
var desc = document.getElementById("Descriptors");
bigImg.innerHTML='<img src="./images/Slider/Placeholder_1.jpg" alt="Helix Jerseys"/>'
desc.innerHTML='<a href="./images/slimming_lines.jpg" rel="lightbox" title="my caption">Descriptor 1</a><a href="./images/slimming_lines.jpg" rel="lightbox" title="my caption">Descriptor 2</a><a href="./images/slimming_lines.jpg" rel="lightbox" title="my caption">Descriptor 3</a>'
});

$('#thmb2').click(function() {
var bigImg = document.getElementById("bigImg");
var desc = document.getElementById("Descriptors");
bigImg.innerHTML='<img src="./images/Slider/Placeholder_2.jpg" alt="Helix Jerseys"/>'
desc.innerHTML='<a href="./images/slimming_lines.jpg" rel="lightbox" title="my caption">Descriptor 4</a><a href="./images/slimming_lines.jpg" rel="lightbox" title="my caption">Descriptor 5</a><a href="./images/slimming_lines.jpg" rel="lightbox" title="my caption">Descriptor 6</a>'
});

});

 <div id="LeftSliders">
    <h1>Main Title</h1>
    <h2>Sub Title</h2>
            <div id="smallImg">
            <img src="./images/Slider/Placeholder_1thmb.jpg" alt="Helix Jerseys" id="thmb1"/>
            <img src="./images/Slider/Placeholder_2thmb.jpg" alt="Helix Jerseys" id="thmb2"/>
        </div>
        <div class="clear"></div>
        <div id="bigImg">
            <img src="./images/Slider/Placeholder_1.jpg" alt="Helix Jerseys"/>
        </div>
        <div id="Descriptors">
            <a href="./images/slimming_lines.jpg" rel="lightbox" title="Descriptor 1">Descriptor 1</a><a href="./images/slimming_lines.jpg" rel="lightbox" title="Descriptor 2">Descriptor 2</a><a href="./images/slimming_lines.jpg" rel="lightbox" title="Descriptor 3">Descriptor 3</a>
            </div>

    </div>
4

0 回答 0