Изображението на IE-7 не идва в горната част

Показвам подсказка onmouseover на div. подсказката се показва правилно във Firefox и IE8. Но в IE-7 идва зад div. HTMl маркиране

<table cellspacing="0" cellpadding="5" border="0" id="tblEmployee">
<tbody>
<tr>
<td>
<div class="dvBorder" empid="1" nomineeid="21">
<img style="padding: 5px;" src="../../Images/user.jpg" alt="user">
<span class="EmpolyeeName">First Last</span><span class="EmployeeEmail">[email protected]</span></div></td>
</tr>
</table>

Когато потребителят постави курсора на мишката върху div.dvBorder, подсказката се създава динамично с помощта на функцията jquery.

 function RollOut(result,crntDiv) {
            $(crntDiv).children('img').before(CreateElems('div', 'RollOverTip', result));
        }

function CreateElems(type,cssClass,value)
        {
            var elem = $(document.createElement(type));

            if(value != null)
                elem.text(value);

            if(cssClass!= null)
                elem.addClass(cssClass);

            return elem;
        }

Класът css.

.RollOverTip
{
    background-image: url("/Images/screen2-rollover-tooltip.png");
    background-repeat: no-repeat;
    color: #000000;
    font-family: Calibri Regular;
    font-size: 18pt;
    height: 199px;
    line-height: 20pt;
    margin-left: 385px;
    position: absolute;
    width: 474px;
    z-index: 90000;
    padding:34px;
}

.dvBorder
{
    background-image: url(/Images/screen2-button.png);
    background-repeat: no-repeat;
    height: 125px;
    width: 400px;
    cursor:pointer;
    position: relative;
}

Проблем ли е с css, тъй като работи в IE-8,FF.


person ankur    schedule 20.02.2013    source източник


Отговори (1)


Опитайте да добавите z-index към вашия клас .dvBorder:

.dvBorder
{
    background-image: url(/Images/screen2-button.png);
    background-repeat: no-repeat;
    height: 125px;
    width: 400px;
    cursor:pointer;
    position: relative;
    z-index:0; /* If this doesn't work, try -1 */
}
person Oneezy    schedule 20.02.2013
comment
искам rollovertip div да се премести над dvborder - person ankur; 20.02.2013
comment
Знам, че това е, което искате... ако дадете на .RollerOverTip z-индекс от 9000 и на .dvBorder z-индекс, това основно поставя основата за това. Опитайте и ми кажете какво се случва, или това, или публикувайте линк на живо или цигулка. - person Oneezy; 20.02.2013
comment
ако е зададено на -1, тогава не се появява изображение при преместване на мишката. Ако е зададено на 1, поведението е същото, което означава, че зад него не идва изображение за промяна - person ankur; 20.02.2013
comment
Бих се опитал да се отърва от таблицата, tbody, tr, td (всичко, свързано с таблицата). Работете с минималните елементи. Възможно е или таблицата да пречи по някакъв начин, или html елементите да не са вложени правилно, за да може z-index да работи правилно. - person Oneezy; 20.02.2013