Отсутствует тень окна внизу iframe

У меня есть это слайд-шоу: http://andrewolff.jalbum.net/Nepal/, работающее в iFrame. :

<iframe src="http://andrewolff.jalbum.net/Nepal/" frameborder="0" scrolling="no" height="240" width="100%" ></iframe>

в таблице, отображаемой на этой странице: http://www.andrewolff.nl/TestAlbum/EmbeddedAlbums/< /а>

Слайд-шоу состоит из абсолютно позиционированных изображений с радиусом границы и тенью:

#slideimage {
  border-radius: 7px;
  box-shadow: 10px 10px 10px rgba(0,0,0,0.4);
}

Это отлично работает, за исключением того, что тень не работает внизу. Пробовал уже с отступом 10px вокруг изображения, но это не помогает. Отступ 10px также не помогает. Я также играл с z-index безрезультатно. Кто знает решение?


html iframe css box-shadow
person André Wolff    schedule 12.12.2015    source источник

Ответы (2)


arrow_upward
0
arrow_downward

просто дайте высоту и сделайте это важным. Он начнет работать

#slideimage
{
   height:200px !important;
}
person Gurmatpal    schedule 12.12.2015
comment
Что ж, это решает проблему, но создает другую проблему: не все изображения имеют одинаковую высоту, поэтому некоторые изображения искажаются. - person André Wolff; 12.12.2015
comment
В этом случае вы, вероятно, захотите заранее подогнать изображения. Это неотъемлемая проблема слайдеров. - person Michael Moriarty; 09.08.2016

arrow_upward
0
arrow_downward

Что ж, Gurmatpal подсказал мне решение: я снова сгенерировал альбомы с помощью программы jAlbum и моего Скин Slide Show 4, но максимальная высота ограничена 230 пикселями. Это также может быть решено с помощью css:

#slideimage {
  border-radius: 7px; box-shadow: 10px 10px 10px rgba(0,0,0,0.4);
  max-height:230px !important; 
}
person André Wolff    schedule 12.12.2015