繁体   English   中英

从文本链接打开Colorbox

[英]open Colorbox from text link

[编辑的问题]

我正在使用图像预览工具提示,该提示利用了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>

提前致谢。

我查看了颜色框页面,并在此处进行了所有说明。

看看这个,这正是您要尝试执行的操作: 示例1

嗯,当我尝试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>

只需在动态创建图库后将其扩展即可。

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

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

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM