从href属性以外的其他内容加载colorbox图像

时间:2012-09-11 14:08:59

标签: jquery colorbox

我明白了:

$(document).ready(function(){
    $(".top_up").colorbox(
        {
            rel:'group3',
            opacity: '0.2'

        }
        );
});

然后用这个:

<a id="172703536171203_661714" class="top_up" rel="pics" href="FULL_IMAGE_LINK" title=""><img src='THUMBNAIL' style='border: medium solid #1A1A1A;' /></a>

工作得很好..

但我希望href =“”不是完整的图像链接,而是让colorbox在rel属性或其他内容中查找完整的图像链接(无关紧要,只是href和id属性)

我该怎么做?

1 个答案:

答案 0 :(得分:7)

你已经99%了。但是,您可以使用自定义数据属性,而不是使用rel属性,从而使代码更具可读性:

<a data-colorbox-href="http://...">
    <img ... />
</a>

然后使用colorbox实例化中的“href”选项,使用回调从单击的链接中获取data-colorbox-href(或其他)的值:

$(".top_up").colorbox({
    //all the other options you have up there, plus...
    href: function() {
        return $(this).attr("data-colorbox-href");
    }
});