Слайд-шоу изображения показывается перед Модальным окном - обновлен с jsfiddle

Вид застрял здесь.Слайд-шоу изображения показывается перед Модальным окном - обновлен с jsfiddle

основе Ханиш обратной связи - я создал Jsfiddle повторить этот вопрос я столкнулся

будет признателен, если кто-нибудь может мне помочь отладить

Я использую следующий плагин для слайд-шоу

http://jquery.malsup.com/cycle/basic.html

Теперь на той же странице я ДИСПЛЕЙ ying text в модальном окне - когда пользователь нажимает на определенные ссылки. Это плагин я использую для модального окна

http://rmcreative.ru/playground/modals_plugin/demo.html

Теперь вопрос - когда модальное окно открывается - изображения из слайд-шоу находятся на верхней части модального окна, а не за

на основе dalefrench обратной связи я попытался с помощью Z-индекс - но не повезло

.modal {

 z-index:1000; 
background: #fff; 
width: 600px; 
margin: 20px auto; 
border-radius: 30px; 
border: 6px solid #000; 
padding: 20px; 
text-align:justify; 
 }
 .slideshow img { padding:5px; background-color:#000; z-index:10; }

Спасибо за ваше время - оценить его

источник

2013-09-04 Gublooo

Попробуйте дать ваш .slideshow элемент значение положения позиции: относительная и то же для .modal. Затем дайте элементу .slideshow значение z-index: -1.

Обновлено скрипку: http://jsfiddle.net/BY4fu/6/

.slideshow { 
    height: 125px; 
    width: 232px; 
    margin-left:20px; 
    position: relative; 
    z-index: -1; 
} 

.modal { 
    z-index:1000; 
    background: #fff; 
    width: 300px; 
    margin: 20px auto; 
    border-radius: 30px; 
    border: 6px solid #000; 
    padding: 20px; 
    text-align:justify; 

}

источник

2013-09-05 05:36:17 timmackay

Спасибо - есть одна небольшая проблема - вся моя страница завернута в контейнере с белым цветом фона - так что, когда я использую z-index: -1 - изображения не отображаются - может быть, что-то глупое - но не может заставить его работать - вот обновленный jsfiddle, обернутый вокруг div с background color white - вы заметите, что изображения не отображаются. http://jsfiddle.net/BY4fu/9/ – Gublooo

@Gublooo Хорошо, я думаю, что я решил это - если вы добавите свойство z-index с высоким значением z ' элемент, он должен дать желаемый результат. Поскольку элемент «shim» является родителем модального значения и имеет значение «position» (фиксированное), необходимо также установить z-index так, чтобы он (child) (модальный) мог быть «поднят» с ним. Это обновление для скрипки: http://jsfiddle.net/BY4fu/11/ – timmackay

Perfect - его работа сейчас - спасибо большое – Gublooo

Как насчет использования z-индекса? Можете ли вы использовать текущий код?

http://jsfiddle.net/Qg5Ts/1/

.modal { 
     position:relative; 
     z-index:1000; 
     background: #fff; 
     width: 300px; 
     margin: 20px auto; 
     border-radius: 30px; 
     border: 6px solid #000; 
     padding: 20px; 
     text-align:justify; 
    }

источник

2013-09-04 12:22:12

Спасибо за предложение Ханиш - я создал jsfiddle и уточнен вопрос со ссылкой на то же самое - благодаря – Gublooo

Вам нужно добавить атрибут позиции к вашему. модальный диалог. z-index требует атрибута position. Работает на меня. –

jsfiddle, который вы предоставили, не работает - изображение перед модальным окном - Спасибо – Gublooo

Дайте модальный более высокий Z-индекс, чем слайд-шоу. Подумайте о z-индексах как о слоях. 1 находится выше 0.

.modal { 
z-index:1000; 
background: #fff; 
width: 600px; 
margin: 20px auto; 
border-radius: 30px; 
border: 6px solid #000; 
padding: 20px; 
text-align:justify;} 

.slideshow img{ 
z-index:10;}

источник

2013-09-04 12:22:53 Dale

Я попробовал ваше предложение z-index - но не смог его исправить - я создал jsfiddle, чтобы вы могли посмотреть - спасибо – Gublooo

Z-index придет вам на помощь. Также проверьте, исправлено ли ваше модальное положение или если модаль находится внутри элемента, положение которого зафиксировано. Если это случай, положение позиции модальное по умолчанию. Для более infoormation на Z-индекса проверить это link

источник

2013-09-04 12:48:31 SsNewbie

Слайд-шоу изображения показывается перед Модальным окном - обновлен с jsfiddle

ответ

Смежные вопросы