Question

我是HTML的新手，希望做一些相当简单的事情。我已经搜索了类似的问题并尝试了解决方案，但没有一个正在运作。

我希望在点击链接时并排显示网页中的两个文档。文档远程存储，不是静态的。一个是PDF，另一个是图像，所以我觉得PDF可能需要嵌入，所以有一个滚动条？

两个文档都在显示，但第二个文档（图像）部分位于屏幕中央的第一个文档上。

我的代码如下：

<a href= "#" onclick= "lightbox_open();"><b>Click me to view files</b></a>

<div id= "light"><a href= "#" onclick= "lightbox_close();"><embed src= "?php
echo $address ?>" style= "float: left;"/><img src = "<?php echo $address2 
?>" style= "float: left; " /></a></div>

<div id= "fade" onclick="lightbox_close();"></div>

<div>

**请注意，lightbox_open（）和lighbox_close（）函数只是在屏幕显示文档时调暗屏幕。

对此的任何帮助将不胜感激。

Answer 1

在此处查看示例http://n-demo.000webhostapp.com/two_docs.html

我在这里使用了iframe，你可以使用类似的嵌入。

以下是使用embed

的示例链接

http://n-demo.000webhostapp.com/embed_two_docs.html

源代码完全相同，只是替换了嵌入的iframe。

def comments_to_dict(comments):
    index = {}
    for comment in comments:
        index[comment.id] = {
            'comment': comment,
            'children': []
        }
    for obj in index.itervalues():
        pid = obj['comment'].parent_id
        index[pid]['children'].append(obj)
    return index

<style> html,
body {
  width: 100%;
  height: 100%;
}
#doc1,
#doc2 {
  display: inline-block;
  width: 49%;
  height: 100%
}
iframe {
  width: 100%;
  height: 100%;
  border: none;
}
#doc1 {
  background-color: red;
}
#doc2 {
  background-color: blue;
}

您无法在此处看到iframe，因为stackoverflow中的代码段已经在iframe中，并且iframe无法在其他iframe中加载。

使用HTML并排显示两个文档

1 个答案: