Warning: file_get_contents(/data/phpspider/zhask/data//catemap/2/jquery/73.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 滚动时弹出模型是否隐藏在主体旁边?_Javascript_Jquery_Html_Css_Twitter Bootstrap - Fatal编程技术网

Javascript 滚动时弹出模型是否隐藏在主体旁边?

Javascript 滚动时弹出模型是否隐藏在主体旁边?,javascript,jquery,html,css,twitter-bootstrap,Javascript,Jquery,Html,Css,Twitter Bootstrap,我已经创建了一个按钮当我点击按钮然后弹出模型显示,但它会隐藏在页面主体旁边,当我滚动时按钮也会隐藏。我希望当弹出出现时,我不能滚动页面主体。我已经使用引导创建了模型弹出。这是屏幕截图 .modal{ 显示:无;/*默认情况下隐藏*/ 位置:固定;/*保持原位*/ z指数:1;/*位于顶部*/ 填充顶部:100px;/*框的位置*/ 左:0; 排名:0; 宽度:100%;/*全宽*/ 高度:100%;/*全高*/ 溢出:自动;/*根据需要启用滚动*/ 背景色:rgb(0,0,0);/*回退色*/

我已经创建了一个
按钮
当我点击
按钮
然后
弹出
模型显示,但它会隐藏在页面主体旁边,当我滚动时按钮也会隐藏。我希望当弹出出现时,我不能滚动页面主体。我已经使用引导创建了模型弹出。这是屏幕截图

.modal{
显示:无;/*默认情况下隐藏*/
位置:固定;/*保持原位*/
z指数:1;/*位于顶部*/
填充顶部:100px;/*框的位置*/
左:0;
排名:0;
宽度:100%;/*全宽*/
高度:100%;/*全高*/
溢出:自动;/*根据需要启用滚动*/
背景色:rgb(0,0,0);/*回退色*/
背景色:rgba(0,0,0,0.4);/*黑色w/不透明度*/
}
/*模态内容*/
.模态内容{
位置:相对位置;
背景色:#fefe;
保证金:自动;
填充:0;
边框:1px实心#888;
宽度:80%;
盒影:0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
-webkit动画名称:animatetop;
-webkit动画持续时间:0.4s;
动画名称:animatetop;
动画持续时间:0.4s
}
/*添加动画*/
@-webkit关键帧动画顶点{
从{top:-300px;不透明度:0}
到{顶部:0;不透明度:1}
}
@关键帧动画顶点{
从{top:-300px;不透明度:0}
到{顶部:0;不透明度:1}
}
/*关闭按钮*/
.结束{
颜色:白色;
浮动:对;
字号:28px;
字体大小:粗体;
}
关闭:悬停,
.结束:聚焦{
颜色:#000;
文字装饰:无;
光标:指针;
}
.模态标题{
填充:2x16px;
背景色:#2098d1;
颜色:白色;
}
.模态体{填充:2px 16px;}
.模态页脚{
填充:2x16px;
背景色:#5cb85c;
颜色:白色;
}

×
订购服务


命令 命令
如果我理解正确,您希望模态位于所有其他元素之上。你需要找出这个物体的最高z指数,然后把一个比这个更大的z指数放在你的模型上。假设您的导航菜单或右下角弹出窗口的z索引值为50,则您需要将模态设置为至少51。像这样的-

.modal {
    /* ... rest of your css ... */
    z-index: 51;
    /* ... rest of your css ... */
}

你能添加你的html代码吗?尝试添加
.modal{z-index:99!important}
更新你的html代码too@SharavnanKv为什么
!重要信息
先生?我的问题解决了。非常感谢@SharavnanKv