Текст смещается после исчезновения jQuery

Question

У меня есть слайдер jQuery, который я сделал на демонстрационном сайте для клиента. (Демо: http://awsudbury.fuelmultimedia.ca/)

Когда текст (на самом деле изображение) поверх оранжевого текста становится блеклым, он сдвигается примерно на 20 пикселей влево и вниз. Кто-нибудь знает, почему это происходит?

Answer 1

Разделите ваше правило .home_slider li.current .featured_wrap (строка 271) на два правила:

.home_slider li .featured_wrap {
    background: url("img/image_text_area_bg.png") no-repeat scroll 0 0 transparent;
    bottom: -17px;
    height: 314px;
    left: -10px;
    position: absolute;
    width: 627px;
}

.home_slider li.current .featured_wrap{
    z-index: 200;
}

Answer 2

Так что я не знаю, является ли это лучшим способом исправить это, но я просто нацелился на абсолютное позиционирование как элементов .current, так и не текущих.

.home_slider li.current .featured_text {
    position: absolute;
    z-index: 300;
    bottom: 35px;
    left: 80px;
}

.home_slider li .featured_text {
    position: absolute;
    z-index: 300;
    bottom: 18px;
    left: 70px;
}