Javascript html图像标题仅适用于侧边上的鼠标

我有一个奇怪的错误，在我的一个页面中，旋转木马中图片的标题（或标题）属性只出现在侧面

我注意到它可能与指示器或幻灯片或旋转木马（来自引导）有一些关系，因为在没有显示标题的区域，指示器是正常的，而在指示器稍微淡出的区域，标题起作用

我附上了一些图片来显示指示器的淡入度和鼠标所在的位置（是的，那张糟糕的蓝色画在鼠标所在的位置就更少了）。黄色区域是标题的作用区域

以下是代码：

<div class = box style = "margin: 0">
        <div id="myCarousel" class="carousel slide" data-ride="carousel" data-interval="10000">
            <!-- Indicators -->
            <ol class="carousel-indicators carousel-control" >
                <li data-target="#myCarousel" data-slide-to="0" title="New Location: 12/03/2014" class="active" ></li>
                <li data-target="#myCarousel" data-slide-to="1" title="Bake Sale Success: 21/07/2015"></li>
            </ol>

            <!-- Wrapper for slides -->
            <div class="carousel-inner">

                <div class="item active">
                    <h2 class="featurette-heading subHeadingText">New Location</h2>
                    <img class="img-responsive center-block" src="../images/Reading%20School.jpg"
                         style="width: 70%; height: 70%;" title="Reading School, new location">

                </div>
<!-- Second slide would come here-->

            </div>
        </div>
    </div>

新位置

问题很简单（答案可能不是xD）当鼠标悬停在整张图片上时，如何使标题出现

编辑：这里是一个JSFIDLE示例

---

由于某些原因，您的

ol.carousel指示器延伸到整个可用高度，从而覆盖您的图像（只是左侧的一小部分）

尝试添加如下内容

.carousel-indicators{
    height:20px;
}

我敢肯定，它解决了你的问题

作为一个额外的建议，Firefox得到了一个真正酷的Firebug扩展，您可以在其中检查并查看页面中每个HTML元素的维度。我认为Chrome中也有类似的东西。希望这有帮助

EDIT在引导CSS中的两个位置是一个
边框底部
指令，用于
旋转木马指示器
，使其一直向下延伸。我想，仅仅删除它们会更干净。
在JSFIDLE或Codepen中复制，我相信有人可以为您指出正确的方向。