Css Hover Tooltip не работает в JqGrid

У меня есть подсказка css, которую я использую для предоставления руководства, и я пытаюсь включить ее в jqgrid.Css Hover Tooltip не работает в JqGrid

Однако название столбца отображается при наведении указателя. <span> нет. Я попытался добавить title:false, но потом ничего не происходит.

Вот CSS я использую:

.tooltip { border-bottom:1px dotted #000000; outline:none; text-decoration:none; cursor:help; } 
.tooltip:hover em { padding: .2em 0 .6em 0; font-weight:bold; display:block; } 
.tooltip { position:relative; } 
.tooltip:hover span { position:absolute; left:1em; top:-4.5em; z-index:99; margin-left:0; width:150px; } 
.tooltip:hover em { border:0; margin: -10px 0 0 -55px; float:left; position:absolute; } 
.tooltip span { margin-left:-999em; position:absolute; }

А вот как он применяется:

<a class='tooltip' href='#'> 
<img alt='Help' src='/Images/question_mark_sm.png' /> 
<span class='tooltip_classic info'>Guidance Tag</span> 
</a>

Не знаю, почему он будет работать в другом месте, но в jqGrid. Я пробовал и пытался, но он, похоже, не работает. (Ну, изображение появляется, и курсор меняется, но нет всплывающего окна.)

источник

2012-04-17 Cody

Вы не включены и код, который показывает, как использовать 'tooltip' класс в jqGrid. Вы используете пользовательский форматтер? Вы пытались увеличить значение 'z-index' (в CSS для' .tooltip: hover span') до некоторого значения больше 1000? – Oleg

Для этого нам, скорее всего, понадобится контекст. Вероятно, есть некоторые другие позиционные или контекстные CSS, связанные с jqGrid, которые вызывают скрытие всплывающей подсказки. –

@ Олег, да, я увеличил 'z-index' до 9999, и он ничего не сделал. Я не использую собственный форматировщик в столбце jqGrid, я отправляю html-код, который я разместил выше, как одну из записей столбца, так что отображается в jqGrid. Просто нет подсказки. – Cody

Попробуйте удалить атрибут tooltip из ячейки jqGrid.

Для меня это отлично работает для всех браузеров, кроме IE7. Я использовал событие jqGrig gridComplete.

Вот пример:

// _YourColID is you column name from colModel 
$("td[aria-describedby*=_YourColID]", "#yourGridID tr").removeAttr("title"); 
$("td[aria-describedby*=_YourColID]", "#yourGridID tr").tooltip({ 

    // each trashcan image works as a trigger 
    tip: '.tooltip', 

    // custom positioning 
    position: 'center right',     

    // move tooltip a little bit to the right 
    offset: [0, -10],     

    // there is no delay when the mouse is moved away from the trigger 
    delay: 0,     
    predelay: 2000,     
    onShow: function(e){ 
    if ($(e.target).parent("tr").attr('id') != -1) { 
     yourTooltipFunction($(e.target).parent("tr").attr("id")); 
    } 
    } 
}).dynamic({ 
    bottom: { 
    direction: 'down', 
    bounce: true 
    } 
});

источник

2012-05-18 17:06:42 Igor

Css Hover Tooltip не работает в JqGrid

ответ

Смежные вопросы