0

我有一个画廊页面,其中列出了图像网格。单击其中一张图像时,我希望弹出颜色框并允许用户循环浏览图像。

使用简单的颜色框可以在所有浏览器上执行此操作,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 仍然存在同样的问题。如果我然后取消注释 return false;。IE 将不再离开页面,但颜色框不再充当图库,这意味着用户无法滚动浏览图像。

我不知道如何阻止 IE 跟踪链接,或者为什么它甚至首先出现。

4

1 回答 1

0

问题原来是在图像 url 上有一个 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
});
于 2013-09-02T07:54:13.630 回答