Полный календарь раскрывающийся список при наведении на событие - PullRequest
Новая
       9

Полный календарь раскрывающийся список при наведении на событие

0 голосов
/ 13 сентября 2018

Я хочу отобразить выпадающий список для полных событий календаря при наведении на них событий. кто-нибудь может мне помочь?

вот снимок экрана, который у меня сейчас

enter image description here

Я хочу выпадающий список поверх всего, что я пробовал z-index, но не смог попасть в топ.

Я не хочу всплывающую подсказку, я просто хочу выпадающий список при наведении на событие.

код, который я пробовал установить полные параметры календаря как: 

eventRender: function (eventObj, $element) {            
        //$element.popover({                
        //    title: eventObj.title,                
        //    content: function () {                                       
        //        return $scope.getToolTipData("","");
        //    },
        //    trigger: 'hover',
        //    placement: 'bottom',
        //    container: 'body'
        //});
        $element.addClass('dropdown');
        $element.append($scope.getToolTipData("","",eventObj.id));
    },
    eventMouseover: function (calEvent, jsEvent) {
        console.log(calEvent);
        $(this).css('z-index', 10000);            
    },
    eventMouseout: function (calEvent, jsEvent) {            
    }

Функция getToolTipData () возвращает выпадающий список как элемент ul, и вот он: 

<ul class="dropdown-menu tooltipevent" id="eventDropdown">
<li>
    <a href="#">
        <div class="media">
            <div class="media-left">
                <span class="icon icon-github icon-2x icon-fw"></span>
            </div>
            <div class="media-body">
                GitHub<br>
                <small>Clone with an SSH key from your GitHub settings.</small>
            </div>
        </div>
    </a>
</li>
<li>
    <a href="#">
        <div class="media">
            <div class="media-left">
                <span class="icon icon-bitbucket icon-2x icon-fw"></span>
            </div>
            <div class="media-body">
                Bitbucket<br>
                <small>Clone with an SSH key from your Bitbucket settings.</small>
            </div>
        </div>
    </a>
</li>
<li>
    <a href="#">
        <div class="media">
            <div class="media-left">
                <span class="icon icon-bitbucket icon-2x icon-fw"></span>
            </div>
            <div class="media-body">
                Bitbucket<br>
                <small>Clone with an SSH key from your Bitbucket settings.</small>
            </div>
        </div>
    </a>
</li>
</ul>

и вот изменение стиля полного календаря, как я получаю его при наведении 

.fc-event:hover .tooltipevent {                
    z-index: 10001 !important;
    display:block !important;               
}

В настоящее время он отображается только в верхней части события, а внутри этой ячейки дня вы хотите, чтобы он находился поверх этой ячейки.

Заранее спасибо.

...