從文本鏈接打開Colorbox

Question

[編輯的問題]

我正在使用圖像預覽工具提示，該提示利用了rel屬性，因此對於顏色框，我正在使用class =“ slideshow”將圖像分組在一起。 我的工作正常，但我希望能夠通過文本鏈接打開幻燈片，如下所示。

（rel =“ medium.jpg”是用於圖像預覽的圖像）

<div id='gallery'>
      <a  href='large.jpg' class="slideshow" rel='medium.jpg'><img src='small.jpg'/></a>
      <a  href='large2.jpg' class="slideshow" rel='medium2.jpg'><img src='small.2jpg'/></a>
    </div>

<!--text link-->
<a href="#" class="openSlideshow">open slideshow</a>

以下是觸發顏色框的標准代碼，我該如何修改才能打開幻燈片？

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script src="../colorbox/jquery.colorbox.js"></script>
<script>
            $(document).ready(function(){
                $("a.openSlideshow").colorbox({slideshow:true});
            });
</script>

提前致謝。

Answer 1

我查看了顏色框頁面，並在此處進行了所有說明。

看看這個，這正是您要嘗試執行的操作： 示例1

Answer 2

嗯，當我嘗試Kai的建議時，它不起作用

使用示例頁面：

$(document).ready(function(){
  //Examples of how to assign the ColorBox event to elements
  $("a.example4").colorbox({ slideshow: true });


    <h2>Slideshow</h2>
    <p><a href="../content/ohoopee1.jpg" class="example4"  title="Me and my grandfather on the Ohoopee.">Grouped Photo 1</a></p>
    <p><a href="../content/ohoopee2.jpg" class="example4"  title="On the Ohoopee as a child">Grouped Photo 2</a></p>
    <p><a href="../content/ohoopee3.jpg" class="example4"  title="On the Ohoopee as an adult">Grouped Photo 3</a></p>

Answer 3

只需在動態創建圖庫后將其擴展即可。

$(document).ready(function() {
            //dynamacially create the gallery here

            $("a.slideshow").colorbox({ slideshow: true });
        })