Javascript 引导模式不适用于引导转盘

我有一个引导模式，点击链接就会打开。但它不能与页面上的引导转盘一起工作。 我尝试将旋转木马HTML置于模式HTML之上，反之亦然，但没有任何帮助：(

模态是这样的-

但实际上应该是这样的-

$（'.carousel'）.carousel({
间隔时间：4000，
停顿：“错”
});
变量$item=$（'.carousel.item'）；
var$wHeight=$（window.height（）；
$item.height（$wHeight）；
$item.addClass（“全屏”）；
$（'.carousel img'）。每个（函数（）{
var$src=$（this.attr（'src'）；
var$color=$（this.attr（'data-color'）；
$（this.parent（）.css）({
“背景图像”：“url（+$src+）”，
“背景色”：$color
});
$（this.remove（）；
});
$（窗口）.on（'resize'，函数（）{
$wHeight=$（窗口）.height（）；
$item.height（$wHeight）；
})；

html，正文{
保证金：0；
填充：0；
身高：100%；
}
/*导航栏*/
.导航{
边际：0px；
}
navbar先生{
边缘底部：0px；
字体系列：“Droid衬线”，衬线；
字体大小：20px；
}
.navbar反向。navbar品牌{
字体大小：20px；
字体系列：“Droid衬线”，衬线；
颜色：#fed136；
}
/*旋转木马*/
.全屏{
背景尺寸：封面；
背景位置：中心；
背景重复：无重复；
}
分组{
位置：绝对位置；
最高：40%；
左：40%；/*更改为您想要的任何内容*/
右：自动；/*更改为您想要的任何内容*/
底部：自动；/*更改为您想要的任何内容*/
}
.旋转木马{
位置：绝对位置；
排名：0；
左：0；
最小宽度：100%；
高度：500px；
z指数：-1；
}
#页脚{
背景色：黑色；
颜色：白色；
字体大小：15px；
文本对齐：居中；
}
/*模态*/
.模式收割台，h4，.关闭{
背景色：#5cb85c；
颜色：白色！重要；
文本对齐：居中；
字体大小：30px；
}
.模态页脚{
背景色：#f9f9f9；
}
.模态体{
最大高度：计算（100vh-210px）；
溢出y：自动；
}
#注册模式对话框{
宽度：40%；
}

从…起
*
班加罗尔
德里
印多尔
孟买
浦那
到
*
班加罗尔
德里
印多尔
孟买
浦那
选择日期*
















版权所有©2016 Bookify。保留所有权利
&时代；
登录
电子邮件
密码
记得我吗
登录
取消
不是会员

&时代；
登记
名称
电子邮件
密码
电话号码（格式：xxxx-xxxxxx）
出生日期
性别
女性
男性
我接受
登记
取消
已成为会员？请登录

在html

<div id="example-form" class="form-group">

---

使样式仅应用于页面上的表单，而不应用于模式中的表单。

在html

<div id="example-form" class="form-group">

---

因此，样式仅应用于页面上的表单，而不应用于模式中的表单。

不，它在chrome版本50.0.2661.87 m上不起作用。我编辑了这个问题，添加了模式的图像，以显示它的外观和应该的外观。虽然这使模式起作用，但删除此表单组CSS会折叠页面上的表单。这是形式和模态是冲突的。不，它在chrome版本50.0.2661.87 m上不起作用