Question

我开发了一个带有升降式镜头的自举旋转木马。问题是当鼠标离开图像时，镜头不会消失，直到鼠标离开镜头。在example shown in official elevateZoom web中，这不会发生（一旦鼠标离开图像，镜头就会消失）。

这是我的代码：

<div id="planos" class="carousel slide" style="border-top:1px solid #FCF3E8; top:-1px" data-interval="false">
    <!-- Wrapper for slides -->
    <div class="carousel-inner" role="listbox" ng-app="planos-module" ng-controller="planos-controller">
        <div ng-repeat="i in getNumber(number) track by $index" class="item" id="plano{{$index+1}}">
            <img ng-src="img/planos/{{$index+1}}.jpg" alt="Plano {{$index+1}}" data-zoom-image="img/planos/{{$index+1}}.jpg" />
        </div>
    </div>
    <!-- Left and right controls -->
    <a class="left carousel-control carousel-control-2" href="#planos" role="button" data-slide="prev">
        <span class="fa fa-angle-left fa-3x" aria-hidden="true"></span>
        <span class="sr-only">Previous</span>
    </a>
    <a class="right carousel-control carousel-control-2" href="#planos" role="button" data-slide="next">
        <span class="fa fa-angle-right fa-3x" aria-hidden="true"></span>
        <span class="sr-only">Next</span>
    </a>
</div>

相关的javascript：

$(document).ready(function(){
    //some code
    $('#plano1').addClass('active');
    $('#planos .item img').each(function(){
        $(this).elevateZoom({
            zoomType   : "lens",
            lensShape : "round",
            lensSize    : 350
        });
    });
    //some more code
});

我做错了什么？

非常感谢

编辑：Here is the JSFiddle。我无法像我的网站一样复制它，但同样的问题正在发生。另外，我无法导入elevateZoom js文件，所以我只是将其内容复制粘贴到js小提琴中（如果你在JS部分向下滚动，你可以看到我的代码）

EDIT2：已解决！答案如下。

Answer 1

解决！

以下是答案，以防其他人遇到同样的问题。

我只需要在我的elevateZoom初始化中添加containLensZoom: true选项。

$(document).ready(function(){
    //some code
    $('#plano1').addClass('active');
    $('#planos .item img').each(function(){
        $(this).elevateZoom({
            zoomType   : "lens",
            lensShape : "round",
            lensSize    : 350,
            containLensZoom : true
        });
    });
    //some more code
});

在BSCarousel bug上提升缩放

1 个答案: