Цикл IE7 слой

Question

У меня есть проблема с использованием небольшого дивирования, который должен «зависать» над фотографиями, которые переключаются с помощью плагина jQuery Cycle. Картинки имеют ширину 950px, а справа на вершине картинок, должна быть маленькая коробка с последними новостями.

Проблема в режиме сопоставки в то есть коробка, кажется, теряет его Z-индекс и заканчивается за картинкой. Он работает в IE8, Opera, Chrome и Firefox.

Я пытался удалить 2 изображения, так что только 1 изображение показывает, а затем по какой -то причине он работает в CompabybodyMode. Я пытался удалить пробелы между IMG-TAGS, но не повезло, маржа: 0; Направка: 0 повсюду, но не повезло

У кого -нибудь есть идеи, что может быть не так?

CSS -код

#Content {
    width: 950px;   
}
#NewsWrapper {
    position: relative;
    padding: 0;
    margin: 0;
    top: 0;
}
#NewsListning {
    float: right;
    height: 200px;
    margin: 0;
    padding: 10px;
    background: yellow;
    top: 0;
    right: 0;
    position: absolute;
    z-index: 12;
    width: 300px;
}
#SlideImages {
    width: 100%;
    margin: 0; 
    padding: 0; 
    float: left; 
    z-index: 11;
}
.SlideImage {
    display: inline;
    float: left;
    padding: 0;
    margin: 0;
    z-index: 11;
}

Код JavaScript

$(function () {
  $('#SlideImages').cycle({
    fx: 'fade',
    speed: 5000
  });
});

HTML -код

<div id="Content">
<div id="SlideImages">
    <img src="/Images/Slide1.jpg" class="SlideImage" />
    <img src="/Images/Slide2.jpg" class="SlideImage" />
    <img src="/Images/Slide3.jpg" class="SlideImage" />
</div>

<div id="NewsWrapper">
  <div id="NewsListning">
    <div>
      <strong>Test 2</strong> 
      Lorem ipsum
    </div>
  </div>
</div>

• Решено - дополнительные примечания*

Во всех браузерах, но IE7 вам нужно указать, например, вверх: 0; Слева: 0, если вы собираетесь использовать позицию: абсолютно. Иначе это обычно оказывается вправо. Еще одна вещь, которая не имеет смысла, когда дело доходит до IE7.

Answer 1

Поместите свой #newswrapper в качестве более высокого индекса, чем #newslisting

Это должно работать

Кроме того, я не смотрел код для цикла, но я предполагаю, что он использует более высокий z-индекс, чем 12. Вы, вероятно, захотите использовать z-index > 1000 за то, что вы хотите быть наиболее вперед на экране.

У меня было очень тяжелое время с подобной проблемой. (CSS сбрасывается, проходя под баннером) Я использовал CSS, чтобы в конечном итоге исправить его, изменил родитель div прижимая всю навигацию position:absolute И действительно высокий z-index Но я проверил это И это сработало очень хорошо.