Jquery 如何在猫头鹰转盘上放置一个固定div并使其响应

我正在尝试创建一个多项目旋转木马，在旋转木马内部有一个固定的元素（一个带模糊的div）（在右边，但没关系，它甚至可以在左边，在中心或某处，覆盖其中一个旋转木马项目）。 我将在其他网站上传一张图片，让您了解：

我用猫头鹰旋转木马作为框架来构建它。到目前为止，我最大的问题是它根本没有反应。每当我改变屏幕大小时，固定的div（我放在旋转木马画布上，但在整个旋转木马div中）只会稍微改变，但它不会跟随每个项目的确切大小

jsFiddle：

$（'.owl carousel'）.owlCarousel({
循环：对，
导航：是的，
导航文本：[
"",
""
],
自动播放：对，
自动播放暂停：对，
响应：{
0: {
项目：3
},
600: {
项目：3
},
1000: {
项目：3
}
}
});
.carousel包裹{
浮动：左；
填充：0.5%；
宽度：60%；
位置：相对位置；
}
/*固定转盘上的空白或闪烁项目*/
.猫头鹰转盘.项目{
位置：相对位置；
z指数：100；
-webkit背面可见性：隐藏；
}
/*端部固定*/
.owl导航>分区{
利润上限：-26px；
位置：绝对位置；
最高：50%；
颜色：#cdcbcd；
}
.猫头鹰导航一{
字体大小：52px；
}
.猫头鹰导航.猫头鹰导航{
左：-30px；
}
.猫头鹰导航。猫头鹰下一个{
右：-30px；
}
.传送带{
浮动：左；
宽度：23.33%；
}
.covercarousel img{
最大宽度：100%
}
.猫头鹰转盘{
宽度：70%；
浮动：左；
位置：相对位置；
}

旋转木马
您是否可以发布一个工作示例代码段/jsfiddle？当然，我现在就添加它