Question

我有一个列出图像网格的图库页面。单击其中一个图像时，我希望弹出颜色框并允许用户循环显示图像。

使用简单的颜色框可以在除IE之外的所有浏览器上执行此操作。即使在打开彩盒后，IE仍然会跟踪链接。

原始代码：

$('a.gallery_image').colorbox({
    transition: 'fade',
    opacity: 0.7,
    speed: 100,
    fixed: true,
    rel: 'gal_img',
    scalePhotos: true,
    maxWidth: ($(window).width() / 100) * 85,
    maxHeight: ($(window).height() / 100) * 85
});

我使用以下方法设法产生了类似的效果：

$('a[rel="gallery_image"]').click(function(e){
    e.preventDefault();

    $('a[rel="gallery_image"]').colorbox({
        maxWidth: '90%',
        initialWidth: '200px',
        initialHeight: '200px',
        speed: 700,
        rel: 'gal_img',
        overlayClose: false
    });
$.colorbox({
    href: $(this).attr('href')
});
//return false;
});

然而，IE仍有同样的问题。如果我然后取消注释返回false; IE将不再离开页面，但颜色框不会充当图库，这意味着用户无法滚动图像。

我没有关于如何阻止IE跟踪链接的想法，或者为什么它甚至在第一时间。

Answer 1

问题是图片网址上有一个itemprop =“image”。不确定为什么导致问题，但删除它已解决了这个问题。这意味着JS回到原来的地方：

$('a.gallery_image').colorbox({
    transition: 'fade',
    opacity: 0.7,
    speed: 100,
    fixed: true,
    rel: 'gal_img',
    scalePhotos: true,
    maxWidth: ($(window).width() / 100) * 85,
    maxHeight: ($(window).height() / 100) * 85
});

在IE上的Colorbox，打开一个颜色框，然后立即关闭页面上的链接

1 个答案: