Наложение изображения поверх встроенного PDF - PullRequest
Новая
       25

Наложение изображения поверх встроенного PDF

3 голосов
/ 17 мая 2011

Я пытаюсь наложить изображение поверх PDF, встроенного в iFrame.

Этот код приводит к тому, что изображение отстает от iFrame (проверяется путем изменения атрибута bottom на -10px, и нижняя часть изображения становится видимой)

Единственные два метода, о которых я знал, - это использование z-index, и абсолютное положение факта должно помещать объект сверху, но ни один из них не работает. 

<div id="images" style="float:right;position:relative" width="400" height="250">
    <img src="images/Next_Black_Arrow.png" style="height:25px;width25px;float: left;z-index=10;position:absolute;bottom:10px;left:250px;">
    <iframe SRC="testFiles/Categories of pattern matching characters.pdf#toolbar=0&navpanes=0&scrollbar=0" style="z-index=1;position:relative;"  width="400" height="250"></iframe>
    </div>

* Applogies за отсутствие разделенных css

Хотя это работает, к сожалению, это не так, если вы измените ссылку iframe на pdf.

См. http://jsfiddle.net/vr4rX/4/

Я думаю, что это может быть ошибка в Adobe Reader. Может действительно обойтись.

1 Ответ

2 голосов
/ 17 мая 2011

посмотрите на мое решение: http://jsfiddle.net/vr4rX/1/

HTML: 

<div id="images">
    <img src="http://t1.ftcdn.net/jpg/00/02/78/72/400_F_2787285_mlDf8ah974XHflVFrbQB3FM6Qxu1MT.jpg" />
    <iframe SRC="http://www.google.de"  width="400" height="250"></iframe>
</div>

CSS: 

#images {
    float:right;
    width: 400px;
    height: 250px;
    position: relative;
    z-index: 1;
}

#images img {
   height:25px;
    width:25px;
    z-index=2;
    position:absolute;
    bottom:20px;
    right:20px;
}
...