Блог

При наведении курсора мыши на элемент, отображающий всплывающую подсказку, холст мерцает. Проблема только в Google Chrome, версия, которую я использую, такова: Version 49.0.2623.112 (64-bit) на Mac.

Поскольку кто-то столкнулся с такой же проблемой.

Код, показывающий всплывающую подсказку

 <div ng-show="model.nbPlay > 0" class="totals-block">
    <div tooltip-placement="right" uib-tooltip="{{model.nbPlay}} plays">
        <i ng-show="model.isPlayed" class="fa fa-play fa-orange"style="margin-left: 2px;"></i>
        <i ng-show="!model.isPlayed" class="fa fa-play" style="margin-left: 2px;"></i>
        <span class="track-nb-stat">{{model.nbPlay}}</span>
    </div>
</div>
  

HTML с холстом

 <div id="canvas-container-{{model.selector}}" class="waveform-container track-height no-overflow">
    <div id="player-container-{{model.selector}}" class="player-container track-height">
        <div id="jquery-jplayer-{{model.selector}}" class="jp-audio" ></div>
        <div id="jp-seek-bar-{{model.selector}}" class="jp-seek-bar track-height">
            <div id="sc-jp-play-bar-{{model.selector}}" class="jp-play-bar sc-jp-play-bar">
                <canvas id="canvas-bg-{{model.selector}}" class="canvas canvas-context" width="1024" height="75" ng-click="play()"></canvas>
                <canvas id="canvas-mouse-{{model.selector}}" class="cursor-canvas canvas-context" width="1024" height="75"></canvas>
                <canvas id="canvas-progress-{{model.selector}}" class="cursor-canvas canvas-context" width="1024" height="75"></canvas>
                <canvas id="canvas-time-{{model.selector}}" class="time-canvas canvas-context" width="1024" height="75"></canvas>
            </div>
        </div>
    </div>
</div>
  

Javascript, который загружает изображение на холст

 loadWaveForm: function (waveform) {
    if (this.getCanvasBgContext()) {
        var that = this;
        var ctx = this.getCanvasBgContext();
        waveform.onload = function () {
            ctx.clearRect(0, 0, that.getCanvasBg().width, that.getCanvasBg().height);
            ctx.drawImage(waveform, 0, 0);
        }
    }
},