Альтернативное решение псевдоэлемента css: before для IE6 / 7

Question

Я создал карусель слайдов, и она использует псевдоэлемент: прежде, чем идентифицировать текущий элемент, на котором вы находитесь, однако псевдоэлемент не поддерживается в IE6 / 7.

Интересно, может ли кто-нибудь придумать альтернативное решение, чтобы псевдоэлемент работал для IE6 / 7.

Вот как выглядит моя страница: http://jsfiddle.net/Qcwta/

JavaScript-решения также приемлемы.

Answer 1

Я использовал IE9.js в прошлом, работает довольно хорошо и добавляет элемент: before /: after 'вместе с другими тонкостями.

Это единственное решение, которое я придумала.

Answer 2

Я добавлю дополнительный элемент в домен следующим образом.

Javascript

for (var i = 0; i < slides.length; i++){
            slideCount += '<li id="slide'+ i+'"><span class="highlight"></span><span>'+(i+1)+'</span></li>' ;
        }

Css

#carousel #slideCount li .highlight {
    display:none;
}

#carousel #slideCount li.current .highlight,
#carousel #slideCount .test {
    border: 5px solid #ccc;
    content: '';
    display: block;
    height: 120px;
    left: -5px;
    position: absolute;
    top: -15px;
    width: 201px;
    z-index: 3;
}

Answer 3

Почему вы не используете jQuery, он поддерживает селектор :before также для IE 6. См. Также CSS: before /: after Селекторы в IE 6,7