设置图像以链接到自身并在彩色框中打开

Question

我有一个通过CSS调整大小的图像,在HTML页面上显示为100x100px.单击时,我想在彩色框中打开图像 - 这样用户就可以看到正常显示的非调整大小/压缩版本.

我已经研究了如何将href的路径设置为自身(因此不必每次都更改)(见下文),虽然不确定如何使colorbox部分工作 - 我尝试改变'each'到'colorbox' - 根据你通常如何分配颜色框,它打开,它只是不加载图像:S

任何指针都会很棒 -

<div class="logoImage"><img src="../tym_img_shared/background-2.jpg" alt="Your company logo" /></div>

 $(document).ready(function(){
$('div.logoImage img').each(function(){
    var $this = $(this);
    $this.wrap('<a href="' + $this.attr('src') + '"></a>');
});

});

更新:考虑一下,也许更容易设置链接的're'属性设置源？

更新:

$(document).ready(function(){
    $('div.logoImage img').each(function(){
        var $this = $(this);
        $this.wrap('<a rel="gallery" href="' + $this.attr('src') + '"></a>');
    });

});

由于某种原因不起作用 - 但是如果我对URL和rel进行硬编码呢？

Answer 1

这样做了......

$(document).ready(function(){
  $('.logoImage img').each(function(){
        var anchor = $('<a/>').attr({'href': this.src}).colorbox({height: "90%", title: "Your Company Logo"});
        $(this).wrap(anchor);
  });
});