IE причудливый режим a: проблема стиля hover - PullRequest
0 голосов
/ 28 января 2012

У меня есть диапазон, который я хочу показывать только при наведении курсора на него.Чтобы увидеть, что я ожидаю, удалите атрибут "href" и попробуйте его в браузере, отличном от IE.

<!-- <!DOCTYPE html> -->
<html>

<head>
    <style>
        .container {
            color: orange;
        }
        a.anchor {
            text-decoration:none;
            display: inline-block;
            cursor: default;
        }
        a.anchor:hover span {
            visibility: visible;
        }
        a.anchor span {
            visibility: hidden;
        }       
    </style>
</head>

<body>
    <div class="container">
        <a class="anchor" href="#">
            <span>XXXXXXXXX</span>
        </a>
    </div>
</body>

</html>

Обратите внимание, что тип документа закомментирован, чтобы перевести IE в режим причуд.В этом режиме IE a: hover не работает с указанным CSS (средством изменения видимости), ЕСЛИ Якорь не содержит атрибута «href».

Однако, добавив «href», IE перезаписывает стиль диапазона в браузерах.стили привязки по умолчанию.В моем приложении контейнер div может иметь динамические стили, затрудняющие перезапись стиля якоря ...

Итак, мои вопросы:

1) Я могу работать только сПричудливый режим.Могу ли я в любом случае получить поведение: hover так, как я хотел, без использования атрибута href?

2) Если ответ на предыдущий вопрос - нет, каков наилучший способ удалить все браузеры по умолчанию?стили якоря?

Я действительно надеюсь не писать сценарий для этого, но если есть какое-либо решение сценария, пожалуйста, сообщите об этом!

Спасибо всем заранее.

1 Ответ

0 голосов
/ 28 января 2012

Попробуйте

    a.anchor:hover span {
        display: inline-block;
    }
    a.anchor span {
        display: none;
    }   

включенный пример http://jsfiddle.net/gHKsY/4/

...