Question

我试图允许用户点击一组拇指，这将打开一个颜色框并显示相应的图像/视频。拇指可以引用图像或视频，因此颜色框应该（希望）正确显示。我当前的实现工作，但我有两个彩色实例，一个用于视频，一个用于图像。我希望我能找到一种方法将两者结合到同一个实例中并允许在两者之间导航......这甚至可能吗？这就是我正在做的事情：

<div id="imageGallery">
    <ul id="thumbs">
        @if (!string.IsNullOrEmpty(Model.Youtube))
        {
            <li class="galleryImage"><a href="http://www.youtube.com/embed/@YoutubeId(Model.Youtube)" class="detailColorBox" id="youtubeVideo"
            title=""><img src="http://img.youtube.com/vi/@YoutubeId(Model.Youtube)/1.jpg" alt="image thumb" /></a></li>
        }
        @foreach (var img in Model.Images)
        {
            <li class="galleryImage"><a href="@Html.ResolvePath(img, "710x560")" class="detailColorBox" 
rel="itemDetailGallery"  title=""><img src="@Html.ResolvePath(img, "135x135")" alt="image thumb" /></a></li>
        }
    </ul>
</div>

在脚本标签内：

        $("a[rel='itemDetailGallery']").colorbox();

        $("#youtubeVideo").colorbox({iframe:true, innerWidth:425, innerHeight:344});

P.S：我还尝试使用Youtube视频ID提供iframe，并将其显示在彩盒中，但也失败了。

有什么想法吗？

Answer 1

试试这个......

$(".detailColorBox").colorbox({rel:'group1'});
$("#youtubeVideo").colorbox({rel:'group1',iframe:true, innerWidth:425, innerHeight:344});

Answer 2

Mine使用UIButton属性：

open:true

Youtube Video＆amp;图像在SAME ColorBox中？

2 个答案: