Javascript 隐藏时删除模式窗口链接

Javascript 隐藏时删除模式窗口链接,javascript,html,css,modal-window,Javascript,Html,Css,Modal Window,我有一个带有链接的模态窗口。脚本使用CSS可见性来显示和隐藏窗口,但当窗口被隐藏时,链接将保持活动状态,从而禁用模式窗口区域内的页面链接 有什么帮助吗 这是一个错误,因为外部链接在代码段上不起作用。模式窗口链接到google.com,页面文本链接到stackoverflow.com jQuery(文档).ready(函数($){ window.onload=setTimeout(函数(){ $(“.bts弹出”).delay(5000).addClass('is-visible'); }, 3

我有一个带有链接的模态窗口。脚本使用CSS可见性来显示和隐藏窗口,但当窗口被隐藏时,链接将保持活动状态,从而禁用模式窗口区域内的页面链接

有什么帮助吗

这是一个错误,因为外部链接在代码段上不起作用。模式窗口链接到google.com,页面文本链接到stackoverflow.com

jQuery(文档).ready(函数($){
window.onload=setTimeout(函数(){
$(“.bts弹出”).delay(5000).addClass('is-visible');
}, 3000);
window.onload=setTimeout(函数(){
$(“.FOLLETO”).delay(5000).addClass('is-visible');
}, 3000); 
//关闭弹出窗口
$('.bts弹出窗口')。在('click',函数(事件){
if($(event.target).is('.close')|$(event.target).is('.bts popup')|$(event.target).is('.bts popup container')){
event.preventDefault();
$(this.removeClass('is-visible');
}
});
//单击esc键盘按钮时关闭弹出窗口
$(文档).keyup(函数(事件){
if(event.which=='27'){
$('.bts popup').removeClass('is-visible');
}
});
});
.bts弹出窗口{
位置:固定;
溢出:自动;
左:0;
排名:0;
身高:100%;
宽度:100%;
背景色:rgba(0,25,28,0.55);
不透明度:0;
可见性:隐藏;
-webkit转换:不透明度0.3s 0s,可见性0.3s;
-moz转换:不透明度0.3s 0s,可见性0.3s;
过渡:不透明度0.3s 0s,可见性0.3s 0s;
z指数:9999;
}
.bts-popup.is-visible{
不透明度:1;
能见度:可见;
-webkit转换:不透明度1s 0s,可见性1s 0s;
-moz转换:不透明度1s 0s,可见性1s 0s;
过渡:不透明度1s 0s,可见性1s 0s;
}
.bts弹出式容器{
位置:相对位置;
宽度:100%;
最大宽度:600px;
保证金:8em自动;
文本对齐:居中;
/*WebKit中的强制硬件加速*/
-webkit背面可见性:隐藏;
-webkit转换属性:-webkit转换;
-moz变换特性:-moz变换;
过渡性质:变换;
-webkit转换持续时间:0.3s;
-moz转换持续时间:0.3s;
过渡时间:0.3s;
}
.bts弹出窗口。关闭{
位置:绝对位置;
最高:0%;
右:2%;
字号:4em;
字体大小:粗体;
文字装饰:无;
颜色:#FF9760;
}
.bts弹出窗口。关闭:悬停{
颜色:#FC621A;
}
.FOLLETO{不透明度:0;
可见性:隐藏;}
.FOLLETO.is-visible
{不透明度:1;
能见度:可见;
-webkit动画:自旋1 0.5s 1线性;
-moz动画:自旋1 0.5s 1线性;
-o-动画:自旋1 0.5s 1线性;
-ms动画:自旋1 0.5s 1线性;
动画:自旋1 0.5s 1线性;
显示:块;
}
@-webkit关键帧spin1{
0%{-webkit变换:旋转(0度)比例(0.1)}
100%{-webkit变换:旋转(360度)比例(1)}
}
@-moz关键帧spin1{
0%{-webkit变换:旋转(0度)比例(0.1)}
100%{-webkit变换:旋转(360度)比例(1)}
}
@-o-关键帧自旋1{
0%{-webkit变换:旋转(0度)比例(0.1)}
100%{-webkit变换:旋转(360度)比例(1)}
}
@-ms关键帧旋转1{
0%{-webkit变换:旋转(0度)比例(0.1)}
100%{-webkit变换:旋转(360度)比例(1)}
}
@-关键帧自旋1{
0%{-webkit变换:旋转(0度)比例(0.1)}
100%{-webkit变换:旋转(360度)比例(1)}
}

有很多方法可以做到这一点,但最直接的方法是使用
显示:无
代替
可见

现在,如果
display:none
不适用于您的用例,您还可以修改
width
。例如,弹出窗口默认设置为
width:0
,但类
可见
将设置
width:100

你也可以玩
z-index
,但我认为上面的两条规则要简单得多

使用
width
的示例进行编辑:

您是否尝试将“可见”添加到stackoverflow.com/“>您好