0

我使用了一个简单的 css 和 js 来在单击图像时将图像显示为弹出窗口,并使用顶部的关闭按钮来关闭图像。openimage 和 closeimage 都是我已经实现为
开放图像功能的 js 函数

function imgv(x,y,img)
{
     document.getElementById('imgv_i2').src = img;
     document.getElementById('imgv_i2').style.width = x;
     document.getElementById('imgv_i2').style.height = y;
     document.getElementById('imgv_i2').width = x;
     document.getElementById('imgv_i2').height = y;
    imgToMiddle('imgv_i2');
    document.getElementById('imgv_i2').style.display = 'block';
}

关闭图像为

function closeimgv()
{
    document.getElementById('imgv_i2').style.display = 'none';
    document.getElementById('imgv_close').style.display = 'none';
}

事件作为

<a href="javascript:void(0);"  onclick="imgv(101,101,'image url');"><img src="image src"></a>

现在在外面点击时关闭图像我已经使用了这些

$('#imgv_i2').click(function(event){
    event.stopPropagation();
});
$('html').click(function() {
if(document.getElementById('imgv_i2').style.display == 'block') {
            closeimgv();
    }
});

现在发生的情况是当点击打开图像触发时关闭图像功能也触发了如何$('html').click();在打开图像功能触发后进行绑定并在关闭图像功能后解除绑定。谢谢。

4

2 回答 2

0

我建议您使用 jquery 插件来处理厚框或弹出窗口,因为它们非常简单且易于实现和自定义。有很多可用的开源插件试用它们,它们确实提供了您要求的自定义类型!

于 2013-10-28T08:27:21.870 回答
0

尝试

$(document).click(function(ev) {
    //avoid clicks on image itself
    if($(ev.originalTarget).is("whatever triggers image opening")) {return;} 

    if(document.getElementById('imgv_i2').style.display == 'block') {
            closeimgv();
    }
});
于 2013-10-28T07:45:55.240 回答